CSS Beautifier / Minifier
Indent compressed CSS for readability or minify back to one line. @media, nested rules, and comments are all handled.
How to Use
Pick "Beautify" (add indentation) or "Minify" (strip whitespace and newlines).
Paste your CSS on the left; the result appears live on the right.
Pick indent width (2, 4, or tab). Minify mode also offers "strip comments". Copy in one click.
FAQ
Does it indent @media queries?
Yes — @media, @supports, @keyframes, @font-face and other nested at-rules are indented based on brace depth.
How are comments handled?
Beautify keeps and positions comments. Minify removes them by default ("strip comments" toggle on); turning the toggle off keeps them.
What does minify actually do?
1) strip comments, 2) collapse whitespace, 3) remove whitespace around { } : ; ,, 4) drop the last semicolon before }. We avoid value-level optimizations like 0px→0 or #ffffff→#fff to preserve the original exactly.
Does it handle malformed CSS?
It's a tokenizer-based formatter. Missing braces or invalid syntax still produce output, but indent depth may drift. For strict validation use the W3C CSS Validator.
Is anything sent to a server?
No. All conversion runs in your browser; nothing leaves the page.