CSS Minifier
Minify CSS by removing unnecessary whitespace and formatting so stylesheets can be more compact for delivery.
Your result will appear here.
CSS Minifier online
Minify CSS by stripping comments and squeezing out whitespace — the same stylesheet, fewer bytes — before you inline it, ship it, or paste it into a size-limited field.
How to use this tool
- Paste your CSS into the input box.
- Click Run Tool (Minify). Comments and formatting whitespace are removed, and the final semicolon of each block is dropped.
- Copy the single-line result from the result panel.
Common uses
Preparing CSS for inlining in an email or a critical-CSS block, shrinking a stylesheet you maintain by hand, fitting styles into a CMS field with a size cap, and checking how much of a file's weight is pure formatting.
How it works
The minifier is a textual squeeze: it deletes /* */ comments, removes whitespace around braces, colons, semicolons, commas and combinators, collapses what remains, and drops the redundant last semicolon before each }. It deliberately does not rewrite values — no colour shortening, no shorthand merging, no rule reordering — so the output is exactly your stylesheet minus its air, with zero risk of changed meaning.
Worked example
The rule
/* header */
.card {
margin: 0 auto;
color: #333;
}minifies to .card{margin:0 auto;color:#333} — 55 bytes of source become 31, roughly half, and the saving grows with comment density. Stylesheets heavy with documentation comments often shrink 30–50%.
Privacy and browser processing
Your CSS is minified in your browser with JavaScript — it is never uploaded or stored.
Frequently asked questions
Is minified CSS safe to ship as-is?
Yes — the transforms are whitespace-and-comment only, which CSS ignores. Keep the readable source as your master copy regardless: minified output is a build artifact, not something to hand-edit later.
Why is the saving smaller than a build tool's?
Production minifiers also rewrite values (0px → 0, #ffffff → #fff, margin shorthands) and merge rules. This tool skips value rewriting on purpose — the output is guaranteed equivalent, at the price of a few percent.
Does it handle @media and nested blocks?
The whitespace rules apply uniformly, including inside @media blocks. Native CSS nesting is squeezed the same way, since the operation is purely textual.
What breaks it?
A string containing comment or brace characters (for example in a content property or data URI) can confuse a textual minifier. If the output looks wrong, check for "/*" or stray braces inside strings first.
Is my code uploaded?
No. Minification runs in your browser; nothing is sent anywhere.