CSS Minifier & Beautifier

Runs in your browserDeveloper Tools#CSS#Web

Minify or beautify CSS and see the size saved. Strings, url() and licence comments are kept.

Minified CSS
The result appears here as you type.
How to use, limits & privacy

About CSS Minifier & Beautifier

Minify CSS to make it smaller, or beautify minified CSS to make it readable again. The minifier removes comments and spaces that CSS does not need, but never touches text in quotes, url() values or /*! licence */ comments, and it keeps the spaces that change meaning. You see the size before and after. It runs in your browser.

How to Use

1

Paste your CSS

Paste a stylesheet into the CSS box, or click Example. The result updates as you type.

2

Choose Minify or Beautify

Minify removes comments and extra spaces. Beautify puts each rule and property on its own line; choose 2 spaces, 4 spaces or a tab under Indent.

3

Copy or download

Check the size change under the boxes, then click Copy or Download .css.

Privacy & Processing

  • Mode: local
  • Files Leave Browser: Local tool processing; review details below
  • Max Input Size: Device memory limits
  • Account Required: No
  • Data Stored Locally: Nothing is saved; the CSS stays in memory only while this page is open.
  • Network Processing: Assets or models may require an initial download

Your CSS is processed in your browser and is never uploaded.

Rules & Limitations

  • Minify removes comments and whitespace only. It does not shorten colours, merge rules or drop unused CSS.
  • Comments that start with /*! (licence notes) are kept.
  • Spaces that matter stay: in .card :focus-visible, in calc(100% - 10px) and before ( in media queries.
  • The CSS is not validated. Unclosed braces, strings or comments are reported as a warning.

Top Suggestions

  • Making a stylesheet smaller before uploading it to a website or WordPress theme
  • Reading minified CSS from a website or a library
  • Tidying CSS before sharing it with a team
  • Checking how much space comments and indentation take

CSS Minifier & Beautifier FAQ

How do I minify CSS online?

Paste the CSS, keep Minify selected and click Copy or Download .css. The size before and after and the percentage saved appear below the boxes.

Is it safe to minify CSS?

Yes, with this tool: it only removes comments and whitespace that CSS ignores, and keeps quoted text, url() values and meaningful spaces such as the one in .card :focus-visible. Always test the page after changing CSS.

What is the difference between minify and beautify?

Minify makes CSS as small as possible for websites to load faster. Beautify adds line breaks and indentation so people can read and edit it. Both keep the same rules.

How much smaller does minified CSS get?

Usually 15–30% for hand-written CSS with comments and indentation. Your server's gzip or Brotli compression shrinks it further.

Is my CSS uploaded?

No. Minifying and beautifying run in your browser, and nothing is saved.