↑↓ to move · Enter to open · Esc to close

CSS Minifier

Shrink CSS by removing comments, whitespace, and redundant characters. See the size before and after, including the gzipped size your visitors actually download.

Runs in your browser. Your data is not uploaded.
Built by · Updated
Minifies as you type for inputs up to 200 KB.

How to use the CSS Minifier

  1. Paste CSS into Code input, or upload or drop a .css file.
  2. Leave Keep license comments ticked if the file contains /*! ... */ notices you must keep.
  3. Press Minify. Copy or download the result and compare the sizes in the summary.

How it works

The minifier reads the CSS token by token, so strings, url() values, and comments are recognised before anything is removed.

  • Comments are removed, except /*! ... */ comments when you keep license comments.
  • Whitespace is removed around {, }, :, ;, ,, and >, and collapsed to one space elsewhere. Spaces around + and - inside calc() are kept, because CSS needs them.
  • The semicolon before each } is dropped, and empty rules are removed.
  • Hex colors like #ffffff become #fff when all three pairs repeat.
  • Saving = 1 − minified size / original size. The gzipped size is measured with your browser's own gzip.

Examples

Input (123 bytes):

/* Buttons */
.btn {
  color: #ffffff;
  padding: 8px 16px;
  width: calc(100% - 2rem);
}

.btn:hover {
  color: #1f5fbf;
}

Output (82 bytes, 33% smaller):

.btn{color:#fff;padding:8px 16px;width:calc(100% - 2rem)}.btn:hover{color:#1f5fbf}

Limitations

  • The minifier is conservative. It doesn't merge rules, reorder properties, or rewrite values, so a tool such as cssnano or Lightning CSS in your build can save a little more.
  • It doesn't check the CSS for errors. Invalid CSS stays invalid.
  • No source map is produced.
  • Files are limited to 5 MB.

Frequently asked questions

Is minified CSS safe to use in production?

Yes. Only characters that browsers ignore are removed, so the styles apply exactly as before. Keep the original file for editing.

How much smaller will my CSS get?

It depends on how many comments and how much indentation the file has. The example on this page goes from 123 to 82 bytes, 33% smaller. After gzip the difference is smaller, because gzip already compresses repeated whitespace well.

Why are /*! comments kept?

By convention, a comment that starts with /*! holds a license or copyright notice that must stay in distributed files.

Often used together with CSS Minifier.

  • CSS Formatter

    Beautifies CSS with one declaration per line and consistent indentation.

  • HTML Formatter

    Beautifies HTML with consistent indentation, including inline CSS and JavaScript.