CSS Formatter

Format CSS Online — Free CSS Beautifier

Turn a single unreadable line of CSS into a tidy, indented stylesheet — or squeeze a finished one down to its smallest size. Paste, pick your indentation, and copy the result.

How to Format CSS

Paste your stylesheet into the CSS input box, choose 2 spaces, 4 spaces, or a tab for the indentation, and click Format. The organised code appears in the Result box, ready to copy with one click. To go the other way, click Minify instead.

What Formatting and Minifying Do

Formatting puts each selector on its own line with the opening brace after it, places every declaration on a line of its own, and lines up the closing brace with the rule it belongs to. Blocks nested inside others, such as rules within an @media query, are indented one step further.

Minifying removes the whitespace around braces, colons, semicolons, and commas, collapses the remaining spaces, and drops the final semicolon in each block. One thing to know: both Format and Minify remove CSS comments, so keep a copy of your original if the comments matter. Neither one checks your CSS for errors, and it's worth testing a minified stylesheet in your browser before you ship it.

Good Uses for This Tool

Making sense of a minified stylesheet from a live site, cleaning up CSS pasted out of a design tool or a page builder, standardising the indentation across a team before a code review, and compressing a small stylesheet to inline in a page or an email.

Is It Actually Private?

Yes. Your CSS is formatted right in your browser — it is never sent to a server or stored.