CSS Formatter

Turn a one-line production stylesheet into something you can actually read — and back again.

About this tool

CSS from build pipelines and third-party themes usually arrives fully minified. This tool re-formats every rule, declaration and media query with consistent indentation, and can minify your own CSS back down by removing comments and unnecessary whitespace.

How to use it

  1. Paste your CSS, or click Sample.
  2. Click Format / Beautify to expand it, or Minify to compress it.
  3. Use ⇅ Output → Input to chain operations without copy-pasting.

Good to know

  • Comments are kept when beautifying and removed when minifying.
  • Strings in content or url() values are respected — semicolons and braces inside them do not break the formatter.
  • The minifier is intentionally conservative: it never touches property values beyond collapsing whitespace, so it is safe for everyday stylesheets.