CSS minifier and beautifier
Shrink your stylesheets by removing comments, whitespace and empty rules, or do the opposite: turn minified CSS into readable, indented code. You will see the original size, the final size and the gzipped size.
Processed 100% in your browser
Ctrl + Enter runCtrl + C copy result
How to use
- 1Paste your CSS, drop a .css file or load the sample.
- 2Choose “Minify” or “Beautify” and adjust the options (licenses, optimization, indentation).
- 3The result updates instantly along with the byte and gzip savings.
- 4Copy the result or download it as a .css file.
Use cases
- Prepare CSS for production and improve Core Web Vitals.
- Read and debug the minified CSS of a website or library.
- Measure how much a stylesheet really weighs when served compressed.
- Clean up legacy CSS: remove comments and empty rules.
Frequently asked questions
What exactly does CSS minification do?
It removes comments, whitespace, line breaks, the last semicolon of each block and empty rules, and shortens values such as #aabbcc → #abc or 0.5 → .5. The browser interprets the CSS exactly the same, but the file is smaller.
Can it break my CSS?
It is designed not to: quoted text, url() values and the spaces inside calc() are preserved, and descendant-selector spaces (for example “a :hover”) are left untouched. Still, review the output before shipping it.
Why keep /*! … */ comments?
By convention, comments starting with /*! hold license notices (MIT, Apache…) that many licenses require you to keep even in minified code.
What does the “gzipped” size mean?
It is the approximate size sent over the network if your server compresses with gzip, computed in your browser with CompressionStream. That is the number that actually affects load speed.