Minify CSS code to reduce file size and improve performance.
Compress CSS code to reduce file size
Characters: 0
Characters: 0
Paste your stylesheet into the input. This can be a full CSS file, a single rule block, or a snippet from a component. Comments and formatting are stripped automatically.
Click Minify to remove whitespace, newlines, and comments. The output is functionally identical to your original CSS but takes up significantly less space on disk and in transit.
Copy the minified CSS and use it in your production site. Always keep the original formatted file as your source — minification is a one-way transformation.
| Element removed | Example (before) | After minification |
|---|---|---|
| Whitespace & newlines | body { color: red; } | body{color:red} |
| Comments | /* Main color */ | (removed) |
| Trailing semicolons | color: red; } | color:red} |
| Spaces around operators | margin: 0 auto ; | margin:0 auto |
| Zero units | padding: 0px; | padding:0 |
| Redundant quotes | font-family: "Arial" | font-family:Arial |
CSS is a render-blocking resource — browsers must download and parse stylesheets before rendering the page. Smaller CSS files mean faster downloads, which directly improves First Contentful Paint (FCP) and Largest Contentful Paint (LCP), both of which are Core Web Vitals metrics used by Google for ranking. On mobile connections, even a 20–50% reduction in CSS file size translates to a measurable improvement in perceived load time. For large projects with multiple stylesheets, combining minification with server-side GZIP or Brotli compression typically achieves 70–90% total size reduction.