Skip to content
SPCXTools

CSS Minifier

Shrink your stylesheets — whitespace, comments and redundant rules removed — and see how much you saved.

Runs locally — files never leave your device

Loading tool…

How to use CSS Minifier

  1. 1Paste your CSS into the Input box, or click Sample.
  2. 2The minified CSS appears on the right automatically.
  3. 3Keep Preserve license comments ticked to keep /*! … */ comments required by many licenses.
  4. 4Copy the result or download it as minified.css.

Make your CSS smaller

Every byte of CSS has to be downloaded and parsed before a page can render, so smaller stylesheets mean faster first paint, better Core Web Vitals and less mobile data. This CSS minifier strips whitespace and comments and applies structural optimizations — merging duplicate rules, shortening colors, removing redundant values — so your stylesheet gets as small as possible without changing how the page looks.

Features

  • Whitespace and comment removal.
  • Value shortening: colors, zeros, units and font weights.
  • Structural optimization: merges duplicate selectors and removes overridden declarations.
  • License comments (/*! … */) kept on request.
  • Size comparison in bytes and percent.
  • Private: runs entirely in your browser.

Before and after

.card .title {
  font-weight: bold;
  color: #333333;
}
.card .title {
  font-size: 1.25em;
}

becomes

.card .title{font-weight:700;color:#333;font-size:1.25em}

When to minify

Minify CSS as part of your build for production, and keep the readable source in version control. Most frameworks and bundlers do this automatically; this tool is handy for quick fixes, CMS themes, email templates, embedded widgets and projects without a build step.

Related tools

Minify scripts with the JavaScript Minifier, create styles visually with the Box Shadow Generator and the CSS Gradient Generator, or format JSON with the JSON Formatter.

Frequently asked questions

What does a CSS minifier do?
It removes everything browsers don't need — whitespace, line breaks and comments — and rewrites values in their shortest form, such as #ffffff → #fff and 0px → 0. This minifier (CSSO) also merges duplicate selectors and declarations and removes overridden properties.
Is minified CSS safe to use?
Yes. Structural optimizations are designed to keep the same visual result. As with any build step, test your pages after deploying, especially if you rely on unusual hacks or invalid CSS.
How much smaller will my CSS be?
Typically 15–40% before compression. Hand-written, well-commented stylesheets shrink the most. Your server's gzip or Brotli compression reduces the transfer size further.
Why keep license comments?
Many open-source licenses require the copyright notice to stay with the code. Comments starting with /*! are the convention for comments that minifiers should keep.
Is my code uploaded?
No. Minification runs in your browser; your code never leaves your device.

Related tools

JavaScript MinifierCompress your JavaScript with Terser — smaller files, same behavior.HTML Encode / DecodeConvert text to safe HTML entities — or turn entities back into readable characters.JSON Formatter & ValidatorBeautify, minify and validate JSON instantly, with clear error locations.Box Shadow GeneratorFine-tune soft, sharp, layered or inset shadows with a live preview and copy the CSS.Base64 Encode & DecodeConvert text and files to Base64 and back, with full UTF-8 and Base64URL support.Base64 to ImageDecode Base64 strings and Data URIs back into viewable, downloadable images instantly in your browser.