CSS Minifier

Runs in browser Formatting

Compress stylesheets while preserving strings, URLs and calc() expressions, with a size comparison.

Privacy: This tool runs entirely in your browser. Your input never leaves your device.

What does a formatter or minifier change in code?

A formatter changes layout — whitespace, line breaks and indentation — so that HTML, CSS or JavaScript reads consistently, and some also normalise details the language treats as equivalent, such as HTML tag-name case or attribute quotes; a minifier removes what the browser does not need — comments, whitespace, optional semicolons — and may rewrite values into shorter equivalents such as #fff for #ffffff. Neither is meant to change what the code does, but review the diff before you commit it: an option that reorders code, such as sorting CSS properties, can change which declaration wins, and a lower-cased tag name breaks a case-sensitive framework component such as <MyComponent>.

How to use CSS Minifier

  1. Paste the stylesheet.
  2. Keep or disable the value optimisations.
  3. Copy or download the minified CSS.

CSS Minifier features

  • Removes comments, whitespace, final semicolons and empty rules
  • Shortens hex colours (#ffffff → #fff) and leading zeros (0.5em → .5em)
  • Drops units on zero lengths outside calc()
  • Keeps strings, url() contents and calc() spacing intact
  • Optionally preserves /*! license */ comments
  • Reports bytes saved

CSS Minifier example

Minify a rule

Input:

body {
  margin: 0px;
  color: #333333;
  padding: 0.5rem;
}

Output:

body{margin:0;color:#333;padding:.5rem}

Frequently asked questions about CSS Minifier

What optimisations are applied?

Whitespace and comments are removed, the last semicolon in each block is dropped, empty rules are deleted, six-digit hex colours are shortened when possible (#ffffff → #fff), leading zeros are trimmed (0.5em → .5em) and zero lengths lose their unit outside calc().

Is calc() safe?

Yes. Spaces around + and − inside calc() are required by the CSS spec and are preserved; zero units inside functions are also kept (calc(100% - 0px) stays valid).

Can I keep a license comment?

Yes. Comments that start with /*! are kept by default.

Does it merge duplicate rules or shorthand properties?

No. Structural optimisations can change the cascade, so the minifier deliberately keeps every rule in place.

References