CSS Minifier

Compress CSS with csso, which removes whitespace, shortens values and merges duplicate rules without changing what the styles do.

CSS
Minified CSS
Runs locally in your browser

About the CSS Minifier

This minifier runs csso in your browser. Beyond stripping whitespace and comments, it shortens colour values (#ffffff to #fff, rgb(0,0,0) to #000), removes redundant units from zeros, collapses margin: 1px 1px 1px 1px to margin: 1px, and with restructuring on, merges rules with identical selectors or declarations. The result applies exactly the same styles with fewer bytes; typical savings are 20 to 40 percent before gzip.

Restructuring reorders rules where that is provably safe. If you rely on source order for a specificity tie or use hacks that depend on duplicates, untick it and the minifier will only remove whitespace and shorten values. Comments starting with /*! can be kept for licence headers.

The stylesheet is syntax-checked first, so a missing brace stops the process with a line number rather than producing broken output. Use the CSS Formatter to expand a minified file again.

How to use

  1. Paste CSS or upload the file.
  2. Leave restructuring on unless you depend on rule order for overrides.
  3. Copy or download the minified stylesheet; the stats line shows the byte saving.

Common questions

Can minification break my styles?
Whitespace removal and value shortening cannot. Restructuring is designed to be safe, but if you use unusual override patterns, turn it off and compare.
Does it add vendor prefixes or remove unused CSS?
No. It only compresses what you give it. Autoprefixing and purging are build-time steps.
How does it compare to cssnano?
csso is comparable in output size for most stylesheets and runs without a build step. The differences are in edge-case optimisations.
Are @media queries merged?
Identical media queries are merged when restructuring is on.