CSS Minifier
Strip CSS comments and collapse unnecessary whitespace to shrink your stylesheet size.
CSS input
Minified output
CSS result
What is CSS minification?
CSS minification removes characters from stylesheet source that browsers ignore — whitespace, newlines, comments, and sometimes redundant values — to reduce the total file size transmitted to the browser. The browser applies the same styles from a minified stylesheet as from the original; only the bytes transferred change. Smaller CSS files parse faster, reduce the render-blocking time on page load, and directly improve Largest Contentful Paint (LCP) — a Core Web Vital that Google uses as a ranking signal.
What CSS minification removes
- Comments: Block comments (
/* ... */) are stripped entirely - Whitespace: Spaces, tabs, and newlines between selectors, declarations, and braces are collapsed or removed
- Trailing semicolons: The last declaration in a rule does not need a semicolon — removing it saves one byte per rule
- Redundant units:
0pxcan be written as0— a unit on zero is unnecessary - Shorthand opportunities: Some minifiers convert multi-property declarations to their shorthand equivalents and compress colour values like
#ffffffto#fff
CSS minification and Core Web Vitals
CSS is render-blocking by default: the browser does not display anything until it has downloaded and parsed all CSS in the <head>. Every kilobyte of CSS that loads before the first paint adds latency. Minification is the quickest win for reducing this cost. For large stylesheets, also consider: splitting critical CSS (above-the-fold styles) from the rest and inlining it in the HTML, using media attributes to load print or large-screen styles conditionally, and removing unused CSS with tools like PurgeCSS or UnCSS.
Minification vs compression
Minification and HTTP compression (gzip/Brotli) work at different levels and both should be used. Minification removes unnecessary characters from the source text — it is applied once and the result is stored. HTTP compression then compresses the minified file again using entropy coding before sending it over the network — applied on every request by the server or CDN. A typical CSS file minified then gzip-compressed is 60–80% smaller than the original unminified file.
How to use this tool
- Paste your CSS into the input editor.
- Click Minify.
- Copy the minified output.
- Use it in your production deployment. Keep the original readable source in version control.
Build tool alternatives
For production projects, automate CSS minification in your build pipeline rather than running it manually. Common options: Vite and webpack minify CSS automatically in production builds. PostCSS with the cssnano plugin provides highly configurable minification. Lightning CSS (formerly Parcel CSS) is a very fast Rust-based minifier that also handles vendor prefixes. dotnet publish in ASP.NET Core handles bundling and minification for Razor applications with the WebOptimizer package.