What is a CSS Minifier?
A CSS Minifier removes unnecessary characters from CSS code — comments, whitespace, and redundant semicolons — without changing how the styles work. Smaller CSS files load faster and use less bandwidth. This tool minifies and formats CSS entirely in your browser; your code is never sent to any server.
How to Use
- Paste your CSS into the input box on the left
- Click Minify to compress, or Format to beautify
- Click Copy to copy the output to your clipboard
The validator runs automatically as you type — a green indicator means your CSS structure is valid, red means there are unclosed or mismatched braces.
Minify vs. Format
| Mode | What it does | When to use |
|---|---|---|
| Minify | Removes comments and whitespace, strips redundant semicolons | Production builds, reducing payload size |
| Format | Adds consistent 2-space indentation, one property per line | Reading, editing, code review |
What the Minifier Removes
- Block comments (
/* ... */) - Whitespace around
:,;,,,{,} - Trailing semicolons before closing
} - Redundant spaces between selectors
Vendor Prefix Detection
The tool detects vendor-prefixed properties in your CSS (-webkit-, -moz-, -ms-, -o-) and lists them below the output. Vendor prefixes were used before browser support was finalised — modern CSS often no longer needs them.
Byte Savings
After minification, the tool shows how many bytes were saved and the percentage reduction. This is the uncompressed saving — gzip or Brotli compression typically reduces CSS by a further 60–80% on top.
CSS Validation
The tool checks for basic structural errors:
- Unclosed blocks — every
{must have a matching} - Extra closing braces — a
}without an opening{is flagged
Quoted strings and comments are excluded from the brace check so curly braces inside them do not count.
Privacy
All processing runs locally in your browser using JavaScript. No CSS is ever uploaded, stored or logged. You can use this tool offline once the page has loaded.