How to format CSS
Paste the code
Paste your CSS or open a .css file, or try “Example”.
Choose the indent
2 spaces, 4 spaces or Tab, and the line width.
Copy or download
Press “Format”, then copy or download the result.
Options
| Option | Values | Most common |
|---|---|---|
| Indent | 2 spaces, 4 spaces, Tab | 2 spaces in most web projects |
| Line width | 80, 100 or 120 characters | 80; longer lines are wrapped |
Tips
Understand a theme’s CSS. Theme and plugin CSS usually ships minified; format it first to find the rule you want to change.
Don’t edit minified files directly. Edit a formatted copy, then minify it again with the CSS Minifier before uploading.
Errors by line number. An unclosed bracket or broken rule? We show exactly where.
FAQ
How do I unminify a CSS file?
Paste the minified file here (or open it) and press “Format” to get each rule and property on its own line. Comments removed by minification don’t come back.
Does formatting change how the CSS works?
No. It only changes whitespace and line breaks, and writes colors in lowercase. We tested it on 17 real files and compared every rule before and after with an independent CSS parser.
Does it support SCSS?
The tool is for CSS, including modern features like nesting. Simple SCSS files may work, but we haven’t tested them.
Which engine does it use?
Prettier 3.9 (MIT) with the PostCSS parser, running in your browser.