Back to Tools

CSS Minifier

Compress your CSS for lightning-fast load times

High Performance

Compression Level

Optimizations

Shorten Colors (#ffffff to #fff) Shorten Units (0px to 0)

Minified Output

Original Size

Minified Size

Smaller stylesheets, fewer bytes to send

Every space, line break and comment in a stylesheet is useful to humans but unnecessary for browsers. Minifying strips them out so the file downloads faster, which matters most for large stylesheets and slower mobile connections. This tool compresses the CSS you paste and shows you exactly how many kilobytes were saved.

Minifying step by step

Paste your stylesheet into the CSS Code Input area. The Clear button empties it and hides the results.
Under Optimizations, keep or untick Shorten Colors, which turns six-digit hex codes like #ffffff into #fff where possible, and Shorten Units, which turns 0px and similar zero values into plain 0.
Click Minify & Compress.
In the Minified Output card, read the Original Size and Minified Size in kilobytes and the percentage reduction.
Use Copy for your clipboard or Download to save minified.css.

What gets removed

All comments between slash-asterisk markers.
Line breaks, tabs and repeated spaces.
Spaces around braces, colons, semicolons, commas and the combinators for child, sibling and adjacent selectors.
The final semicolon before each closing brace.

Who benefits

Developers without a bundler who ship a handwritten stylesheet.
WordPress and CMS users adding custom CSS to a theme box with a size limit.
Email or embedded widgets where every byte counts.
Anyone wanting a fast estimate of how much a build tool could save.

Check the result before deploying

This minifier works with text patterns rather than a full CSS parser. Its spacing rules also remove spaces around plus signs, so an expression such as calc(1px + 2px) can become calc(1px+2px), which browsers reject. If your stylesheet uses calc(), review those lines or protect them, and test the page after replacing your file. Comments that must be kept, such as licence banners, are removed as well.

The percentage shown compares character counts of the input and output, not compressed transfer size. Servers usually apply gzip or Brotli on top, so real network savings are smaller than the on-page figure, though smaller source still helps. The Compression Level menu is offered, but the compression is identical for both settings, so the checkboxes are the meaningful controls. Keep the original file: minified code is hard to edit, and the Beautifier or Formatter can restore readability if you lose your source.

Related Tools

Frequently Asked Questions

Is minified CSS safe to use directly?

Usually, but the tool uses simple text rules, so test the result. In particular, spaces around plus signs are removed, which can break calc() expressions written with spaces. Check those lines in the output.

What do the two optimisation checkboxes do?

Shorten Colors converts repeating six-digit hex codes into three digits, such as #aabbcc into #abc. Shorten Units turns zero values with px, em, rem, %, vw or vh into a bare 0.

Are my comments kept?

No. All slash-asterisk comments are removed, including licence notices. If you need to preserve a banner comment, paste it back at the top of the minified file manually after copying the result.

Does the Compression Level setting change anything?

Not at the moment. The Standard and Extreme choices produce the same output, so rely on the two checkboxes to control the optimisations that are actually applied to your stylesheet.

How is the reduction percentage calculated?

It compares the number of characters before and after minifying and shows the sizes in kilobytes. It does not measure gzip or Brotli transfer size, so real-world savings on the network will differ.