Beautify CSS files.

With npm do:

npm install perfectionist --save

h1   {
         color   :  red }

h1 {
    color: red;
}

h1 { color: red; }

h1{color:red}

Type: string Required option.

Pass a CSS string to beautify it.

Type: boolean Default: true

Set this to false to disable visual cascading of vendor prefixed properties. Note that this transform only applies to the expanded format.

h1 {
    -webkit-border-radius: 12px;
            border-radius: 12px;
}

h1 {
    -webkit-border-radius: 12px;
    border-radius: 12px;
}

Type: string Default: expanded

Pass either expanded, compact or compressed. Note that the compressed format only facilitates simple whitespace compression around selectors & declarations. For more powerful compression, see cssnano.

Type: number Default: 4

This number will be used as a basis for all indent levels, using the expanded format.

Type: boolean|number Default: 80

If set to a positive integer, set a maximum width for at-rule parameters; if they exceed this, they will be split up over multiple lines. If false, this behaviour will not be performed. Note that this transform only applies to the expanded format.

Type: boolean|number Default: 80

If set to a positive integer, set a maximum width for a selector string; if it exceeds this, it will be split up over multiple lines. If false, this behaviour will not be performed. Note that this transform is excluded from the compressed format.

Type: boolean|number Default: 80

If set to a positive integer, set a maximum width for a property value; if it exceeds this, it will be split up over multiple lines. If false, this behaviour will not be performed. Note that this transform only applies to the expanded format.

Type: boolean Default: false

Generate a sourcemap with the transformed CSS.

Type: string

Specify scss if you would like to also format SCSS-style single line comments. This loads the postcss-scss plugin.

perfectionist can also be consumed as a PostCSS plugin. See the documentation for examples for your environment.

perfectionist also ships with a CLI app. To see the available options, just run:

$ perfectionist --help

See the PostCSS documentation for examples for your environment.

• Sublime Text plugin
• Atom plugin

Pull requests are welcome. If you add functionality, then please add unit tests to cover it.

MIT © Ben Briggs