CSS Minifier

Features

• Comment and whitespace removal
• Optional zero-value and hex-colour shortening
• Beautify mode for reading minified CSS
• Byte-level savings report
• Preserves strings and url() contents

How to use it

1. Paste your CSS into the input box.
2. Choose which optimisations to apply.
3. Press Minify, or Beautify to expand it again.
4. Copy or download the result.

What minification actually saves

CSS minification typically removes 20% to 35% of the raw bytes, mostly whitespace and comments. But it is worth being clear-eyed about the real benefit: if your server sends CSS with gzip or brotli compression enabled, and it should, much of that saving already happens automatically, because repeated indentation and long runs of spaces compress extremely well. Minifying before compressing usually yields a further 5% to 15%, which is worth having but is not transformative.

The safe optimisations are unambiguous. 0px can become 0 in most contexts, since the unit is meaningless at zero. #ffffff can become #fff when the pairs repeat. A leading zero in 0.5em is optional. The final semicolon in a block is redundant. None of these change behaviour.

Two caveats. Zero without units is not always safe, inside flex-basis and in some calc() expressions a unit is required, and stripping it breaks the rule. And minifiers must not touch the inside of strings or url() values, where whitespace and case can be significant. This tool protects those regions, but the general principle applies: always test a minified stylesheet before shipping it, rather than assuming byte-identical rendering.