CSS Minifier & Beautifier

CSS Minifier & Beautifier is a two-way stylesheet tool: it compresses CSS by removing everything the browser does not need - comments, whitespace, redundant semicolons, long-form hex colors and units on zero values - and it can reverse the process, expanding a single-line production bundle back into readable, properly indented rules. Every byte you strip from a render-blocking stylesheet is a byte the browser downloads and parses sooner, which directly feeds Core Web Vitals metrics like First Contentful Paint and Largest Contentful Paint.

The minifier is deliberately conservative. It is fully aware of string literals, url() values and calc() expressions, so it never removes the whitespace that calc(100% - 20px) depends on, never rewrites color-like text inside a content string, and never touches the spacing that distinguishes div :hover from div:hover. On typical hand-written stylesheets you can expect a 25–40% size reduction before gzip; combined with gzip or Brotli on the wire, minification still shaves a meaningful slice because compression works better on repetitive, comment-free input.

Everything runs 100% client-side in your browser. Your CSS is never uploaded, logged or stored on any server, which means you can safely paste proprietary design-system code, unreleased product styles or client work. It also works offline once the page is loaded - useful when you need a quick minify pass without wiring up a full PostCSS or esbuild pipeline.

Minification here is syntax-aware rather than a set of find-and-replace rules, which is what makes it safe to run on production stylesheets: whitespace inside strings, url() values and attribute selectors is left alone, since removing it would change what the CSS matches. Comments beginning with an exclamation mark are kept, which is the convention for licence headers that have to survive a build.