Will beautifying or minifying change how my page looks?

No. Only whitespace, line breaks, indentation and comments change; selectors, values and declaration order stay the same. The one exception to watch is property sorting: if a rule sets background-color before the background shorthand, sorting can change which one wins, so leave sorting off in that case.

How much smaller does minified CSS get?

It depends on how much whitespace and commenting the source has. Hand-written, commented stylesheets typically shrink by 20–40%, while already minified files barely change. Serve the result with gzip or brotli compression for the biggest savings.

Does it support SCSS or Less?

It targets standard CSS, including nesting, custom properties (--variables) and all at-rules. SCSS or Less code that shares CSS structure, such as nested rules and variable declarations, usually formats fine, but preprocessor-only syntax like @mixin arguments or // line comments may not be handled correctly.

No. Everything runs in your browser without any network request, and your code is discarded when you close the page.

🎨

🎨CSS Formatter & Minifier - Beautify or Compress CSS Online

CSS copied from browser devtools, a minified production bundle or an old project is often crammed onto one line or indented inconsistently. Paste it here for a tidy stylesheet: one declaration per line with a space after the colon, one selector per line, spaced >, + and ~ combinators, spaces after commas and a consistent !important; @media, @supports, @font-face, @keyframes and native CSS nesting (&:hover) are indented by depth. The tokenizer understands strings, comments and unquoted url(data:…) values, so semicolons and braces inside them are never split. Choose 2 / 4 spaces or tabs, strip comments, or sort properties alphabetically with vendor-prefixed versions first. Minify removes whitespace, comments and trailing semicolons, optionally keeps /*! license comments, and reports the size before and after.

Free · No sign-up · Runs in your browserLast updated: 2026-10-26

Loading tool...

How to use CSS Formatter

1Paste your CSS
2Choose Beautify or Minify and set indentation, sorting and comment options
3Copy or download the result

FAQ

Will beautifying or minifying change how my page looks?: No. Only whitespace, line breaks, indentation and comments change; selectors, values and declaration order stay the same. The one exception to watch is property sorting: if a rule sets background-color before the background shorthand, sorting can change which one wins, so leave sorting off in that case.
How much smaller does minified CSS get?: It depends on how much whitespace and commenting the source has. Hand-written, commented stylesheets typically shrink by 20–40%, while already minified files barely change. Serve the result with gzip or brotli compression for the biggest savings.
Does it support SCSS or Less?: It targets standard CSS, including nesting, custom properties (--variables) and all at-rules. SCSS or Less code that shares CSS structure, such as nested rules and variable declarations, usually formats fine, but preprocessor-only syntax like @mixin arguments or // line comments may not be handled correctly.
Is my code uploaded?: No. Everything runs in your browser without any network request, and your code is discarded when you close the page.