Free CSS Minifier
Minify CSS in your browser: strip comments and tighten whitespace. Local byte stats — not cssnano-level optimization.
Sample CSS
About CSS Minifier
Regex pipeline: strips `/* */` comments, collapses whitespace, tightens `{}`, `:`, `;`, `,`. Not `cssnano`, `clean-css`, or Lightning CSS.
How it works (technical)
Steps: `replace(/\/\*[\s\S]*?\*\//g,'')` → collapse runs of whitespace → tighten around `{` `}` `:` `;` `,` → `replace(/;}/g,'}')` → trim.
No selector merging, shorthand rewriting, or color shortening.
Byte counts from `Blob` length; all processing stays in the browser.
When to use it
Whitespace audit
Measure how much comments and spacing add to a hand-written or pasted sheet.
Inline or embedded CSS
Produce a tighter string for demos or HTML email–style blocks.
Compare with bundlers
Rough pass before your build’s cssnano/Lightning CSS for production.
How to Use CSS Minifier
- 1Paste your CSS code into the input area.
- 2Click the "Minify CSS" button to compress your stylesheet.
- 3View the compression statistics showing size reduction.
- 4Copy the minified CSS to use in your project.
Key Features
- Custom regex pipeline (see technical details)
- Original / minified bytes + percent saved
- Copy output
Benefits
- •Instant size readout
- •Client-side only
- •One-click copy
Frequently Asked Questions
Will CSS minification affect my styles?
No, CSS minification only removes unnecessary characters. Your styles will render exactly the same way in browsers.
How much smaller will my CSS file be?
CSS files typically reduce by 20-40% after minification, depending on the amount of whitespace and comments in the original.
Should I keep the original CSS file?
Yes, always keep your original formatted CSS for development. Use minified CSS only for production deployment.