CSS Formatter & Minifier
Beautify messy CSS or minify it for production — instantly, in your browser.
Paste or type CSS above to beautify or minify it.
How it works
Paste a stylesheet and it is re-printed instantly. Format gives you readable
CSS: one declaration per line, a consistent space after every colon, each selector in a
comma-separated list on its own line, nested @media and @supports
blocks indented, and a blank line between top-level rules. Pick 2-space, 4-space or tab
indentation. Minify does the opposite: comments are dropped, all optional
whitespace and the final semicolon of every block are removed, and everything is squeezed
onto one line — the status line shows the before/after byte count and how much you saved.
The parser is written for CSS, not a generic whitespace crusher: strings,
url(...) values (including base64 data URIs), comments and attribute selectors
are kept byte-for-byte, and descendant spaces such as a :hover are never
collapsed into a:hover. Colours, units and property order are left exactly as
you wrote them, so minifying never changes how your page renders. Unbalanced braces, stray
} characters and unterminated comments or strings are reported with the line
number.
Everything runs in your browser in plain JavaScript — nothing is uploaded, so it is safe for client work, internal design systems and any stylesheet you would rather not paste into a random website. Use Copy CSS or Download .css to take the result with you.
Frequently asked questions
How do I format CSS online?
Paste your stylesheet into the box and the formatted result appears as you type — no button needed. Press Format for readable output with one declaration per line and your choice of 2-space, 4-space or tab indentation, or press Minify to squeeze everything onto one line. Then use Copy CSS or Download .css to take the result with you.
Does minifying CSS change how my site looks?
No. Minifying only removes things the browser ignores: comments, optional whitespace and the final semicolon inside each block. Selectors, property order, colour values and units are left exactly as you wrote them, and strings, url() data URIs and descendant spaces such as "a :hover" are preserved byte-for-byte, so the rendered page is identical.
Is my CSS uploaded to a server?
Never. The parser and formatter are plain JavaScript that run inside your browser tab, so your stylesheet is never sent anywhere, never logged and never stored. That makes it safe for client projects, internal design systems and anything under NDA — and it also means the tool keeps working offline once the page has loaded.