CSS Minifier / Beautifier
Minify CSS to shrink file size, or beautify minified CSS for readability. Drag-and-drop upload, before/after stats, download. Browser-based.
What is the CSS Minifier / Beautifier?
A CSS minifier strips comments, whitespace, and unnecessary characters from a stylesheet, producing the smallest valid file that renders identically. Smaller CSS means less bytes over the wire, faster First Contentful Paint, and a small but real boost to Core Web Vitals. The reverse, beautify, restores formatting so a minified file can be read or edited.
How to use the CSS Minifier / Beautifier
- 1
Paste or upload your CSS
Drop CSS into the input pane, drag a .css file onto it, or click Upload. Load Sample drops in an example to play with.
- 2
Click Minify or Beautify
Minify removes comments and collapses whitespace into the smallest valid output. Beautify takes minified CSS and adds line breaks, indentation, and spacing back.
- 3
Read the savings
After minify, a green badge shows percent saved and bytes shaved. After beautify, the line count appears.
- 4
Copy or download
Copy puts the result on your clipboard. Download saves it as <name>.min.css (minified) or <name>.formatted.css (beautified).
Frequently Asked Questions
What does CSS minification do?
Strips comments (/* ... */), collapses whitespace, removes line breaks, and drops unnecessary characters like the semicolon before a closing brace. The browser parses the minified file the same way as the original, so visual output is identical, but the file is typically 20 to 60% smaller depending on how heavily it was commented.
Can I unminify CSS?
Yes. Click Beautify and the minified CSS gets line breaks, two-space indentation, and proper spacing around braces and colons. The output is the same CSS, just formatted for human reading; rules and selectors aren't reorganized.
Is my CSS sent to a server?
No. Both minify and beautify run as in-page JavaScript. Open DevTools, switch to Network, and you'll see no outbound request when you click either button. Safe for proprietary stylesheets, internal design system code, or anything you wouldn't paste into a third-party tool.
How much can CSS minification save?
Typically 20 to 60% file size reduction. Hand-written CSS with generous comments and indentation tends to shrink the most. CSS already produced by a build tool (already partially compressed) saves less. Run a site through PageSpeed Insights and look for "Minify CSS" suggestions to know whether it would actually move the needle for you.