On this page
Overview
Paste minified or inconsistently formatted CSS and get it beautified with one property per line, consistent brace placement, and adjustable indentation - powered by js-beautify’s battle-tested css_beautify, the same beautification engine used across countless code editors and online formatters, rather than a hand-rolled formatter. This is the inverse of the CSS Minifier: where that tool strips whitespace for production, this one restores readable structure for review, debugging, or learning what a compressed stylesheet actually contains. Selectors, media queries, nested at-rules, and vendor-prefixed properties are all preserved exactly, only the whitespace and layout change. Everything runs client-side, so stylesheets never leave your browser.
Best for: Un-minifying a production stylesheet to debug a style
How to use this tool
- Paste minified or messy CSS. A compressed production stylesheet or just inconsistently formatted rules.
- js-beautify reformats it. The same beautification engine used across many code editors restructures the rules.
- Set the indent width. Switch between 2- and 4-space output depending on your project’s style guide.
- Copy the readable output. One property per line, consistent brace placement, ready to read or debug.
Can I check how the formatted CSS actually looks applied to a page?
This tool formats the stylesheet text itself - it doesn’t render anything. To see the rules in action, paste the formatted CSS alongside some markup into the HTML Viewer and check the result in its live preview, which is a lot faster than reading selectors and guessing at the outcome.
Why use this tool
Powered by css_beautify
Uses js-beautify’s dedicated CSS engine rather than a formatter written from scratch for this site.
Turns a compressed file back into a readable one
Take a stylesheet straight from a live site’s network tab and get it back into a scannable structure.
One property per line
Makes it possible to actually scan a rule block instead of reading one long compressed line.
Reversible with the CSS Minifier
Shrink a stylesheet for production, then bring it back here later if you need to read it again.
Frequently asked questions
Yes - that’s exactly the use case this tool is built for. Paste in a minified CSS file and it restores line breaks, indentation, and one-property-per-line formatting so you can actually read what a compressed stylesheet contains, which is useful when debugging a live site’s styles or reviewing a third-party library’s CSS.
No - only whitespace and layout change. Selectors, property names, values, and the cascade order are all preserved exactly as written, so the visual output of your stylesheet is identical before and after formatting; the only difference is how easy it is for a human to read.