CSS Minifier & Beautifier
Shrink CSS for faster pages, or format it so it is easy to read.
How to use: Paste your CSS, then press Minify for the smallest file or Beautify for neat, indented code. Copy or download the result.
How to use the CSS Minifier & Beautifier
Every byte of CSS has to be downloaded before a page can render, so smaller stylesheets mean faster first paint, especially on mobile data. Minification removes everything the browser does not need while keeping the styles identical.
Paste your stylesheet and press Minify. The tool strips comments and line breaks, removes spaces around braces, colons, semicolons and commas, drops the last semicolon in each rule, turns values like 0px into 0 and 0.5em into .5em, shortens colours such as #ffffff to #fff and deletes empty rules. Strings and url() values are protected so nothing inside quotes changes. Licence comments starting with /*! can be kept, as many open-source licences require.
Beautify does the opposite: it takes minified or messy CSS and puts each declaration on its own line with consistent indentation and spacing, which makes debugging and code review much easier. Nested at-rules such as @media are indented correctly.
The status line shows the size before and after and the percentage saved. Copy the result or download it as a file. For production sites, combine minification with gzip or Brotli compression on your server for the biggest gains. All processing runs locally in your browser.
Frequently asked questions
Will minifying break my CSS?
No. It only removes characters the browser ignores, and strings are protected. Keep your original file for editing.
How much smaller will it get?
Typically 15 to 40 percent before server compression, depending on how many comments and spaces the original has.
Can it un-minify CSS?
Yes. Press Beautify to expand minified CSS into readable code.