CSS minification is the process of removing all unnecessary characters from CSS source code without changing its functionality. This includes spaces, newlines, comments, and redundant semicolons.
What Gets Removed During Minification?
- Whitespace (spaces, tabs, newlines)
- Comments (/* ... */)
- Trailing semicolons before }
- Unnecessary units (0px → 0)
- Redundant quotes in URLs
How Much Size Can You Save?
Typical CSS files shrink by 20-40% after minification. Bootstrap CSS, for example, goes from 194KB to 159KB (minified) — a 18% reduction before compression.
Minification vs Compression (gzip)
Minification and gzip compression work together and are complementary. Minification reduces file size at the source level. gzip compresses bytes over the network. Always do both.
Should You Edit Minified CSS?
Never edit minified CSS directly. Always keep a source CSS file, make changes there, and re-minify. Use source maps for debugging in browser DevTools.