Minify CSS to shrink file sizes, or beautify minified CSS for readability. Pure client-side — your code never leaves your browser.
This CSS minifier and beautifier compresses stylesheets to the smallest possible byte size for production, or pretty-prints minified CSS back into clean, readable code — instantly, with a live before-and-after byte count so you can see exactly how much you saved.
Minification strips everything a browser does not need to render your styles: comments, line breaks, indentation, the spaces around braces and colons, redundant trailing semicolons, and empty rule blocks. The result is functionally identical CSS that downloads faster and parses sooner, which directly improves page-load metrics like First Contentful Paint and Core Web Vitals. Beautify mode does the reverse — it re-indents a single dense line of minified CSS into a structured, properly nested layout you can actually read and edit, with your choice of two-space, four-space, or tab indentation. Both run the same parser that respects quoted strings and modern syntax, so it never mangles a selector or a content value. People use it to:
Everything happens locally in your browser using plain JavaScript — your CSS is never uploaded to a server, logged, or stored anywhere. You can paste proprietary or unreleased styles with confidence, work offline once the page has loaded, and process as many files as you like with no size caps, sign-up, or rate limits.
.css file.Typical reductions are 20–40% before gzip — more if your source has lots of comments or whitespace. Combined with gzip/Brotli compression, minified CSS often loads 60–80% faster than formatted CSS over the wire.
No. Only whitespace, comments, and redundant semicolons are removed. Selectors, declarations, media queries, and string contents are preserved exactly. If something breaks, the original CSS likely had a bug.
Yes — native CSS nesting, custom properties, container queries, layers, and @supports blocks are passed through correctly. Quoted strings (e.g. content: ";") are preserved verbatim so the minifier never breaks them.
It removes everything the browser does not need to apply your styles: comments, line breaks, indentation, the spaces around braces, colons, and commas, redundant trailing semicolons before a closing brace, and any empty rule blocks. The actual selectors, property names, values, and quoted strings are left untouched, so the meaning of the stylesheet stays identical.
The exact original formatting cannot be recovered, because comments and your specific indentation are discarded during minification. However, you can switch to Beautify mode to re-indent any minified CSS into a clean, readable structure with consistent spacing and line breaks. The styles behave the same; only the visual layout of the code is regenerated.
No. Minification is a purely cosmetic change to the source text — it only deletes whitespace and characters that have no effect on parsing. The rendered page looks and behaves exactly the same as it did with the original formatted CSS. If a page looks different after minifying, the original stylesheet relied on something invalid, such as a malformed comment or an unclosed rule.
No. All processing runs entirely in your browser with JavaScript, so your CSS never leaves your device. Nothing is sent to a server, logged, or stored. That makes it safe for proprietary or unreleased stylesheets, and it keeps working offline once the page has loaded.