🎨 CSS Minifier

The CSS Minifier strips comments and unnecessary whitespace from a stylesheet to reduce its file size, which means fewer bytes to download and a faster-rendering page. Smaller CSS is one of the easiest front-end performance wins, especially on mobile connections.

How to Use This Tool

Paste your CSS and press Minify. The tool removes comments and collapses whitespace, then shows the minified CSS along with the size saved. Copy it into your production stylesheet.

What This Tool Checks

It removes /* comments */, collapses runs of whitespace, and trims the spaces around braces, colons and semicolons — while preserving the actual rules and values so the stylesheet behaves identically.

Understanding Your Results

The size-saved figure shows how many bytes (and what percentage) the minification removed. Typical savings are meaningful on hand-written CSS with lots of comments and indentation; already-optimised CSS will compress less.

How to Fix Common Problems

If something breaks after minifying, it is almost always a pre-existing issue exposed by the change (a missing semicolon, for example) rather than the minifier itself. Keep your readable source and re-minify from it rather than editing the minified file.

SEO Best Practices

Minify as part of your build or deployment, not as a one-off you then have to maintain. Always keep the un-minified source as the file you actually edit. Combine minification with gzip/brotli compression on the server for the biggest saving.

Example

A stylesheet with comments, indentation and blank lines between rules typically shrinks noticeably once comments and whitespace are removed — the tool reports the exact before/after byte counts.

Common Mistakes to Avoid

Editing the minified output by hand and losing the readable source. Treating minification as a substitute for server compression — you want both.