CSS Minifier
Minify CSS by removing comments, whitespace, empty rules, and shortening hex colors. See original and minified size with savings percentage.
What is CSS Minification?
CSS minification is the process of removing every byte from a stylesheet that doesn't affect how the browser parses it: comments, indentation, blank lines, the spaces around
{ and :, the trailing semicolon in each rule block, even the leading zero in 0.5em. Smarter minifiers also shorten hex colors (#ffffff → #fff), drop redundant unit specifiers (0px → 0), and collapse longhand properties into shorthands. The output is byte-identical in behavior but typically 20–40% smaller — and CSS is render-blocking, so every byte trimmed translates directly to faster First Contentful Paint on mobile networks. This minifier runs the full pass in your browser. Pair it with the JavaScript Minifier and HTML Minifier for a complete production build.Input CSS
Minified Output
Original Size
0bytes
Minified Size
0bytes
Savings
0.0%
Options
Remove Comments
Remove Whitespace
Remove Empty Rules
Shorten Hex Colors
Remove Zero Units
How to use this tool
- 1Paste your CSSDrop a stylesheet into the input editor. The minifier handles plain CSS — for SCSS or Less, compile first.
- 2Click MinifyThe output editor shows the compressed CSS instantly, along with the original size, minified size, and percentage saved.
- 3Copy and shipHit Copy and paste the minified CSS into your build output, CDN bundle, or inline <style> tag.