Skip to content
Devtools 360

Beautify or Minify CSS Stylesheets

Turn compressed or inconsistent stylesheets into clean, readable CSS, SCSS or Less. Switch to Minify mode to strip comments and whitespace from plain CSS and see how many bytes you save.

Runs in your browserFree · No sign-up

How to format or minify CSS

  1. Paste your stylesheet, click Sample, or open a .css, .scss or .less file up to 5 MB.
  2. Pick the syntax (CSS, SCSS or Less) and the mode: Beautify or Minify (Minify is available for plain CSS).
  3. Adjust indentation, line width and quote style, or keep /*! license comments when minifying.
  4. Copy the output or download it; the stats show input and output size.

Supported formats

Input
CSS, SCSS, Less
Output
Formatted CSS, Minified CSS
Maximum size
5 MB per file (limited by your device's memory)

Benefits

  • Supports SCSS and Less syntax, including nesting, variables and mixins.
  • The minifier preserves strings, url() values and calc() spacing so styles keep working.
  • Shows the exact size change so you can measure the benefit of minification.

Limitations

  • Minify only removes comments and whitespace; it does not merge rules, shorten colours or remove unused CSS.
  • Minify is not available for SCSS or Less — compile them to CSS first.

Privacy and security

Formatting (Prettier) and minification run in this browser tab. Stylesheets are not uploaded.

Read our privacy policy for details about the site as a whole.

Frequently asked questions

Is the minified CSS safe to use in production?

Yes for standard CSS: only comments and insignificant whitespace are removed, and the final semicolon in each block is dropped. Test once if your CSS relies on unusual hacks.

Why keep /*! comments?

By convention, comments starting with /*! contain licence notices that must be kept when redistributing third-party CSS.

Can it convert SCSS to CSS?

No. It formats SCSS as SCSS. Compiling requires a Sass compiler, which is not included.