CSS minifier and beautifier

Paste your stylesheet and click "Minify" to remove unnecessary comments, spaces and line breaks, or "Beautify" to turn compressed CSS into readable, well-indented code. Everything happens in your browser.

CSS


What does the minifier do?

It removes everything the browser does not need: comments, indentation, line breaks, spaces around braces, colons, commas and combinators, and the last semicolon of each block. The result is usually 15% to 30% smaller and works exactly the same.

We keep what must not be touched: string contents (content: "…"), url() paths, the required spaces in calc() and media queries, and comments starting with /*!, which by convention contain licences and must be preserved.

Minifying in production

Fewer bytes mean faster downloads and better Core Web Vitals, especially on mobile. Besides minifying, enable gzip or Brotli compression on the server, which shrinks CSS much further, and serve files with long-lived caching.

In a project with a build step (Vite, webpack, PostCSS…) minification happens automatically with cssnano or Lightning CSS; this tool is handy for simple websites, templates, or to read (beautify) another site's minified CSS.