Skip to content
My Tiny Utils

Search tools

Type to find a tool, then press Enter to open it.

CSS Minifier

Minify CSS by removing comments, collapsing whitespace, and dropping trailing semicolons — strings and url() values preserved.

Processed locally in your browser — nothing is uploaded.

CSS Minifier

0 characters

Minified CSS

Output appears here…

About CSS Minifier

Removes comments, squeezes out whitespace that CSS grammar makes insignificant, and drops the last semicolon in every block. The result is byte-for-byte equivalent to the browser.

Care is taken where naive minifiers break things: spaces inside calc() stay, the space before a pseudo-class in a selector stays, url() contents and quoted strings are copied verbatim, and /*! licence comments are kept.

Common uses

  • Compress a hand-written stylesheet for a site with no build pipeline
  • Squeeze critical CSS down before inlining it in a page's head
  • Check how much of a stylesheet's size is comments and formatting

Example

Input

.a , .b {
  color: red;
  margin: 0 auto;
}

Output

.a,.b{color:red;margin:0 auto}

Limitations

  • Whitespace-level only: colours are not shortened, shorthand is not rewritten, and duplicate rules are not merged

Frequently asked questions

Is it safe to minify CSS that uses calc()?

Yes. Spaces inside calc() expressions are preserved, which matters because calc(100% - 20px) is valid while calc(100%-20px) is not — the space around + and - is part of the syntax. Naive minifiers that strip every space break exactly this case.

Does my stylesheet get uploaded when I minify it?

No. Minification happens in your browser as you type; the CSS is never sent to a server or stored, so proprietary styles and unreleased designs stay on your device.

Why is a comment still left in my minified CSS?

Comments that start with /*! are license or attribution blocks, and the minifier keeps them on purpose — many open-source licenses require the notice to survive minification. All ordinary /* */ comments are removed.

Why doesn't the minifier shorten my hex colors or merge rules?

By design it works only at the whitespace level: comments, insignificant spaces, and trailing semicolons are removed, but no value is rewritten. That keeps the output provably equivalent to your input; rewriting colors, shorthand, or duplicate rules is a job for a build-step optimiser.

Why does minified CSS drop the last semicolon in each block?

The semicolon is a separator between declarations, not a terminator, so the one before a closing brace is optional in CSS grammar. Removing it saves a byte per block with no change in meaning.