CSS Minifier

What this tool does

CSS Minifier removes comments and collapses non-essential whitespace around selectors, braces, colons and commas, a safe, conservative minification that reduces file size without rewriting values or merging rules, all computed locally with no library dependency.

Shrinking a CSS file’s size for faster page loads usually happens automatically in a build pipeline, but for a quick one-off snippet, pasting it through a minifier directly is faster than setting up tooling.

This tool strips comments and collapses whitespace around selectors, braces, colons and commas, a safe, conservative minification that reduces size without rewriting colour values, merging duplicate rules, or other more aggressive optimisations a full build-tool minifier might attempt.

How to use CSS Minifier

1. Paste your CSS.
2. Review the before/after size comparison.
3. Copy or download the minified output.
4. Keep your original, readable source for future edits.

Tips for better results

• This is a conservative, safe minification, it won’t rewrite colour values (like #ffffff to #fff) or merge duplicate selectors the way a more aggressive dedicated build-tool minifier (like cssnano) would.
• Minified CSS is harder to read or debug directly, keep your original, formatted source as the file you actually edit, and minify only the final output for production.
• For most real projects, CSS minification happens automatically as part of a build pipeline (Vite, webpack, etc.); this tool is most useful for a quick one-off snippet or inline <style> block.
• The percentage reduction shown gives a quick sense of how much comments and formatting whitespace were contributing to the file’s size, versus the actual rules themselves.

Common use cases

• Quickly minifying a small CSS snippet or inline <style> block without setting up build tooling.
• Reducing the size of CSS pasted into a context with a character limit.
• Stripping comments from CSS before sharing it publicly.
• Checking how much of a stylesheet’s size comes from comments and formatting versus actual rules.

Common mistakes to avoid

• Editing the minified output directly going forward; keep your original, readable source as the file you actually maintain, and re-minify from that each time instead of working from compressed code.
• Expecting colour value shortening (#ffffff to #fff) or duplicate rule merging; this minifier is intentionally conservative and only strips comments and non-essential whitespace, not more aggressive rewrites.
• Minifying CSS that still has unresolved syntax errors; a minifier doesn’t validate or fix invalid CSS, it only compresses whatever you give it, errors in the source will persist in the minified output.