CSS Minifier

A CSS minifier shrinks a stylesheet by removing everything the browser does not need to apply the styles — comments, redundant whitespace, the trailing semicolon before a closing brace, the space around colons and commas, and the leading zero on decimal values. The output behaves identically to the input but ships in 30–50% fewer bytes, which compounds with gzip compression for total transfer sizes 70–80% smaller than the hand-written source.

The transforms are safe and boring. Stripping /* comments */ is never an issue because CSS comments have no runtime effect. Collapsing consecutive whitespace is safe because CSS is insensitive to it outside of quoted strings. Removing space around braces, colons, and commas never changes meaning — the CSS spec defines these as syntactic delimiters, not as whitespace-significant tokens. Collapsing units on zero (0px→ 0) works because the CSS spec explicitly allows a dimensionless zero for any length-unit property.

Gzip interaction. Most developers worry that minification shrinks gzipped transfer sizes only slightly. That's partly true — gzip is good at compressing repeated whitespace and comments. But two compounding wins keep minification worthwhile: (1) theparser still has to load the full file into memory before gzip can do anything, which costs memory and CPU on mobile devices; (2) many build pipelines serve uncompressed fallbacks to older clients, and minification is the only transfer-size optimisation that applies everywhere.

Our minifier is opinionated-safe. It does not reorder rules (which changes cascade behaviour), rename class names (a bundler's job), inline @imports (a preprocessor's job), or prune unused CSS (which requires whole-site analysis — see purgecss or Tailwind's tree-shake). For those deeper optimisations, use a build-time tool in your pipeline. This tool handles the safe 90% in a single paste.

Privacy: the CSS you paste never leaves your browser. Useful when working on proprietary theme files, under-NDA brand templates, or stylesheets that contain embedded sensitive values (CMS-generated selectors, for example).

1. Paste CSS into the input panel.
2. Review the minified output — size-saved percentage appears underneath.
3. Copy or download as a .css file for deploy.

• Safe transforms only — output renders identically to input.
• Strips comments, collapses whitespace, drops redundant semicolons.
• Shortens zero values (0px → 0) and decimal prefixes (0.5 → .5).
• Live size-saved percentage.
• Runs in your browser — CSS never uploads.