CSS Minifier & Beautifier
Minify CSS to reduce file size or beautify/format CSS code online. Free CSS optimizer tool.
About this calculator
Paste CSS and press Minify to strip comments and whitespace, or Beautify to format minified CSS into a readable layout. A sample stylesheet is loaded.
Minifying shrinks files and speeds up pages.
How to use it
- Paste your CSS.
- Press Minify CSS or Beautify CSS.
- Press Copy Output.
What minifying does
The minifier removes comments, line breaks and extra spaces, and trims spaces around { } : ; ,. It does not rename selectors or merge rules, so the result is safe and typically 20 to 40% smaller. Combine it with gzip or Brotli on the server for the best result.
Worked example
Before body { margin: 0; /* reset */ }
| After | body{margin:0} |
Tips and common mistakes
- Keep an unminified source copy.
- Serve compressed (gzip/Brotli).
- Remove unused CSS for bigger gains.
- Test the page after minifying.
- Use build tools in production projects.
Frequently asked questions
What does a CSS minifier do?
It removes comments and unnecessary whitespace.
How much smaller will it get?
Often 20 to 40%.
Can minification break my CSS?
Rarely, if the source has syntax errors.
What is beautify?
The reverse: it adds indentation and line breaks.
Do I still need gzip?
Yes, they work together.
Does it remove unused rules?
No.