What Is a CSS Minifier?
A CSS minifier compresses stylesheets by stripping comments, collapsing whitespace, shortening color and zero values, and tightening safe shorthands. Smaller CSS means faster downloads for render-blocking stylesheets—especially when stacked with gzip or Brotli on the server.
This free online CSS compressor runs in your browser. Paste CSS, choose options, and copy the minified output with an exact before-and-after byte report. Declarations with !important are preserved.
Online Minify vs cssnano, clean-css, and PostCSS
Production pipelines often use PostCSS with cssnano, clean-css, or Lightning CSS for deeper optimizations, source maps, and unused-CSS removal. This page is for quick compress-and-check workflows without installing a package—then mirror the same habits in CI.
Critical CSS extraction and unused selector purging are separate steps. Minify the CSS you ship; extract above-the-fold CSS and drop dead rules in the build for the largest Core Web Vitals wins.
What This CSS Minifier Does
- Comment stripping
- Whitespace removal around selectors and declarations
- Hex color shortening (#ffffff → #fff)
- Zero-value shortening (0px → 0, 0.5 → .5)
- Margin/padding shorthand collapsing when equal sides match
- Trailing semicolon removal before closing braces
- !important preservation and string/url safety
- Exact file size reduction report in bytes
CSS Minifier FAQs
What is a CSS minifier?
A CSS minifier (or CSS compressor) removes comments and unnecessary whitespace, shortens color values, and collapses safe shorthands so stylesheets download faster while keeping the same rendered result—including !important declarations.
Is CSS minification the same as gzip or Brotli?
No. Minification shrinks the CSS source itself. Gzip and Brotli are transfer encodings. Use both: minify with a CSS minify tool (or cssnano / clean-css / PostCSS in your build), then serve with compression. That reduces render-blocking CSS weight.
Does this collapse shorthand and shorten colors?
Yes. Optional passes shorten #rrggbb to #rgb when safe, trim zero units (0px → 0), and collapse margin/padding values like 16px 16px 16px 16px → 16px. Aggressive unused-CSS removal and full cssnano pipelines belong in your build.
Will !important be preserved?
Yes. The minifier keeps !important on declarations. It does not rewrite selectors or remove rules, so specificity and intentional overrides stay intact.
What about critical CSS and unused CSS?
This tool compresses the CSS you paste; it does not extract critical CSS or purge unused selectors. Pair minification with critical-CSS extraction and unused-CSS removal (PurgeCSS, Lightning CSS, etc.) in production builds for the largest gains.
Can I use source maps with minified CSS?
Online paste tools do not emit source maps. In CI, use PostCSS, cssnano, or clean-css with sourceMap: true so DevTools can map minified lines back to your authoring files.
Is this a free online CSS minifier?
Yes. Paste CSS, review the byte savings report, and copy the result. Processing stays in your browser—nothing is uploaded to LiveTechHacks.