CSS Minifier
Minify CSS online. Remove comments, whitespace, and redundant characters to reduce file size.
Input CSS
Minified Output
Why Minify CSS?
CSS files are render-blocking — the browser won't paint anything until it's downloaded and parsed your stylesheets. Every kilobyte of CSS directly delays your First Contentful Paint (FCP). Minification removes the parts humans need (comments, indentation, whitespace) while keeping everything the browser needs.
A typical stylesheet shrinks 20-40% after minification. Combined with Gzip/Brotli compression, a 100 KB CSS file can drop to under 15 KB over the wire. Faster initial render, better Core Web Vitals, improved search rankings.
What Minification Removes
| Element | Before | After | Safe? |
|---|---|---|---|
| Comments | /* Header styles */ | (removed) | Always safe |
| Indentation | margin: 0; | margin:0 | Always safe |
| Selector spacing | .btn > span { } | .btn>span{} | Always safe |
| Last semicolons | color: red; } | color:red} | Always safe |
| Line breaks | Multiple lines per rule | One continuous line | Always safe |
The minified CSS renders identically. Browsers don't need whitespace or comments. Always keep your source files readable and only minify for production output.
Real Size Savings
Here's what minification looks like on real-world stylesheets:
| Stylesheet | Original | Minified | Savings |
|---|---|---|---|
| Small site (50 rules) | 8 KB | 5 KB | 37% |
| Medium site (200 rules) | 35 KB | 24 KB | 31% |
| Bootstrap 5 | 230 KB | 190 KB | 17% |
| Tailwind (purged) | 50 KB | 38 KB | 24% |
After Gzip, the minified files compress even further — typically 70-85% smaller. Minification + compression is the standard production pipeline.
Build Tool Comparison
For production projects, build tools do more than basic minification. Here's how they compare:
This tool (online)
Quick one-off minification. No setup needed. Paste CSS, get minified output. Ideal for snippets, debugging, or when you're not near your build environment.
cssnano / PostCSS
Production standard. Advanced optimisations: shorthand merging, colour reduction, calc() simplification. Integrates with Webpack, Vite, Rollup.
Lightning CSS
Rust-based, extremely fast. Handles minification, vendor prefixing, and CSS nesting in one pass. The modern choice for new projects.
PurgeCSS / Tailwind JIT
Removes unused CSS entirely — not just whitespace but whole rules. The biggest wins come from tree-shaking, not minification.
Related Tools
How to use this tool
Paste your CSS into the input area
Click Minify CSS to compress
Copy the result or download as styles.min.css
Common uses
- Reducing CSS file size for production deployment
- Stripping comments before going live
- Preparing inline CSS for HTML email templates
- Quick minification for small CSS snippets
Share this tool