CSS Minifier - Compress CSS

Overview

Shrink your CSS — safely and privately

A CSS Minifier shrinks a stylesheet by removing comments and insignificant whitespace and tightening syntax (like dropping the last semicolon in a block). The result is smaller but renders identically — the cascade and every rule are unchanged. This one runs entirely in your browser, so your CSS is never uploaded.

The CSS minifier in dark mode: a formatted stylesheet in the cyan editor pane on the left, and the magenta pane on the right holding it compacted onto one line with the /*! banner comment still present, the content string still reading "a, b" and calc(100% - 2rem) still carrying its spaces — Minified, with the three things that must not change still unchanged: the banner, the string, and the spaces calc() needs

What it will not touch, and why. The minifier reads the stylesheet with a tokenizer, so a string and an unquoted url() are values rather than text to run replacements over. That matters in three places people hit constantly: content: "a, b" keeps its space, url(data:image/png;base64,…) is not cut at its first semicolon, and the whitespace calc(), min(), max() and clamp() require around + and - stays — calc(100%+2px) is not valid CSS and is not smaller in any way that matters. Zero shortening applies to length units only: 0% is a @keyframes selector and a legal hsl() argument, and it is never 0.

Smaller stylesheets load faster. A CSS minifier reduces file size by removing comments and collapsing whitespace, and by tightening syntax — trimming spaces around braces, colons, and semicolons, and dropping the redundant final semicolon in each rule. The result is the smallest equivalent CSS: it looks unreadable, but the browser renders it exactly the same.

Paste your CSS or load a local file, choose your options (remove comments, collapse whitespace, and optionally preserve important comments like /*! license */ banners), and the tool minifies it and shows the size before and after with the percentage saved. It preserves url() and string contents exactly, and never reorders or renames anything. Copy, download, or flip back to beautify whenever you like.

Privacy is the throughline. Minifying happens in your browser — no server, no upload, no logging, no tracking. You can minify proprietary stylesheets without any of it leaving your device, and the tool works offline once loaded.

Some honest notes. Unlike HTML, CSS minification is safe — CSS ignores insignificant whitespace, so removing it never changes which rules apply, the cascade, or specificity; your styles behave identically. But it's a minifier, not an optimiser: it won't merge duplicate rules, remove unused CSS, or add vendor prefixes — for those, use a build tool like cssnano/PostCSS. It targets plain CSS, so compile SCSS/LESS first. And for transport, server compression (gzip/brotli) usually saves more than minifying alone, though the two stack.

For the reverse, see the CSS Formatter; for markup and scripts, the HTML Minifier and JavaScript Minifier.

Use cases

When a CSS minifier helps

Faster pages. Trim stylesheet size for quicker loads.
Production builds. Ship minified CSS by hand when no build step exists.
Inline styles. Compact CSS embedded in HTML or a CMS.
Bandwidth. Reduce transfer where compression isn't applied.
Sensitive stylesheets. Minify proprietary CSS without uploading it.

Guide

How to minify CSS

Paste or load your CSS

Type it, paste it, or open a local file (read in-browser, not uploaded).

Choose options

Two switches, and both shape the minified output only. Comments is three-way: remove all, keep /*! banners (the default), or keep all. Shorten zero lengths turns 0px, 0rem, 0em and the other length units into a plain 0 — and deliberately leaves 0%, 0s and 0deg alone, because those are not interchangeable with 0.

Minify

The tool strips whitespace/comments and tightens syntax.

Check the size saved

See bytes before/after and the percentage.

Copy or download

Grab the minified CSS — it renders identically. Nothing is sent anywhere.

Realistic example

A commented, indented 60 KB stylesheet might minify to around 45 KB — roughly a quarter smaller — before any server compression. The tool shows the exact saving for your file.

Advanced tip

Keep a license banner in the output by wrapping it as /*! ... */ and enabling "preserve important comments".

Common mistake to avoid

Don't expect the minifier to remove unused rules or duplicate selectors — that's an optimiser's job (like cssnano). Minifying only strips whitespace and comments.

To read minified CSS again, use the CSS Formatter.

Good to know

What to keep in mind

Zero-knowledge and private. Minifying runs in your browser — nothing uploaded, logged, or tracked, and it works offline.
Equivalent and safe. It only removes whitespace/comments and tightens syntax; the cascade, specificity, and every rule are unchanged.
Preserves important comments. Optionally keep /*! ... */ license banners; url() and strings are always preserved.
Not an optimiser. It won't merge rules, remove unused CSS, or add vendor prefixes.
Preprocessor + gzip. Compile SCSS/LESS first; and gzip on your server usually saves more, though they stack.

Support

Frequently Asked Questions

The CSS minifier with Beautify selected: the comments switch and the zero switch are hidden because they do not apply, and the magenta pane holds the stylesheet expanded again with one declaration per line — Beautify reverses the compaction on the same page. It cannot bring back comments that were removed, which is what the Comments switch is for

The CSS minifier with Comments set to Remove all: the banner comment that was at the top of the stylesheet is gone from the magenta pane, and the saved percentage in the stat line underneath has gone up — Remove all takes the banner too. It is the smallest output and it is not always the one you want to ship

The CSS minifier on a 390-pixel phone: the Minify and Beautify buttons across the top with the comment options below them, a two-button tab strip reading Your CSS and Result, and the minified stylesheet filling the width — On a phone the two panes become a tab strip and the option rows stack

How do I minify CSS?

Paste your CSS (or load a local file), choose your options — remove comments, collapse whitespace — and the tool strips the non-essential characters and tightens the syntax to produce the smallest equivalent stylesheet. It shows the size before and after so you can see the saving. Then copy or download the minified CSS. Everything happens in your browser; nothing is uploaded.

Does minifying change my styles?

No. CSS ignores insignificant whitespace, so removing it and comments never changes which rules apply, the order of the cascade, or specificity — your page looks exactly the same. The minifier preserves url() values and string contents, and never reorders, merges, or renames anything. It's a safe, equivalent transformation; only the file size changes.

Does this upload my CSS, and does it work offline?

No upload, and yes it works offline. All processing happens in your browser using JavaScript — there's no server receiving your stylesheet, no logging, and no tracking. That makes it safe for proprietary CSS. Once the page has loaded it keeps working with no internet connection, which you can confirm in your browser's network tab.

What does minifying CSS remove?

Comments and insignificant whitespace, and nothing else. It removes /* comments according to the Comments switch, collapses runs of whitespace that carry no meaning, tightens the space around braces, colons, semicolons, commas and the selector combinators >, + and ~, and drops the last semicolon before a closing brace. It does not remove rules, properties or values, it does not reorder anything, and it leaves alone every space that a value actually needs — inside a string, inside a url(), between the parts of a shorthand, and around the operators in calc().

Does it keep license or important comments?

It can. Yes, and it is a three-way switch rather than a checkbox. A comment opened with /*! instead of /* is the convention for a banner that must survive minification — a licence, an attribution, a version string. Keep /*! is the default here: bang comments stay, every other comment goes. Remove all takes the banner too, and Keep all leaves every comment in place, which is occasionally what you want when you are minifying to compare two files rather than to ship one.

How much smaller does minifying CSS make it?

It depends on how much whitespace and how many comments the file has. Well-commented, indented stylesheets often shrink by roughly 20–40% before any server compression. Already-tight CSS saves less. The tool reports the exact bytes and percentage for your file. Remember gzip/brotli on your server usually saves more on top of this.

What's the difference between minifying and gzip?

Minifying removes comments and whitespace from the CSS text itself. Gzip/brotli is compression your server applies during transfer, which removes redundancy far more aggressively. For network transport, gzip usually saves more than minifying alone — but they stack, so minify then compress for the smallest transfer. Minifying is most valuable where compression isn't applied, or to keep files lean by default.

Does it remove unused CSS or merge rules?

No — it's a minifier, not an optimiser. It won't detect and remove unused selectors, merge duplicate rules, combine shorthand properties, or add vendor prefixes. Those transformations change the stylesheet's structure and need a dedicated tool like cssnano or PurgeCSS in your build. This tool only strips whitespace and comments, keeping every rule exactly as written.

Can I reverse it — beautify the CSS again?

Yes. Minifying only removes whitespace and comments, so press Beautify at the top of this tool to expand it straight back into readable CSS, or use the dedicated CSS Formatter for indentation and property-sorting options. Note that beautifying re-indents from scratch and cannot recover comments that minification removed — set Comments to keep them, or keep your original source.

Does it work with SCSS or LESS?

Not directly — it targets plain CSS. SCSS and LESS are preprocessor languages with their own syntax (variables, nesting, mixins) that must be compiled to CSS first; only then should you minify the output. If you paste raw SCSS/LESS, the tool may not handle preprocessor syntax correctly. Compile with Sass/Less, then minify the resulting .css.

Can I load a file instead of pasting?

Yes. You can open a local .css file and the tool reads it directly in your browser with the FileReader API — the contents load into the editor without being uploaded anywhere. This is handy for larger stylesheets or ones you'd rather not copy and paste, and it's exactly as private as pasting the CSS by hand.

Is it free, and are there limits?

Yes, completely free — no payment, no signup, no account, and no usage caps or watermarks. Since everything runs in your browser, there's nothing for us to meter; the only practical limit is your device's performance on very large stylesheets. Use it as much as you like, including offline once the page has loaded.

Why does it leave the spaces in calc() and not shorten 0%?

Because removing them would produce CSS that does not work. calc() is specified to require whitespace around its + and -: calc(100% - 2px) is a subtraction, and calc(100%-2px) is a percentage followed by a negative length, which the parser rejects — so the rule is dropped and the layout changes. 0% is the same kind of trap from the other direction: it is a valid @keyframes selector and a required argument form in hsl() and hwb(), where a bare 0 is invalid. Both were things this tool used to do. The bytes involved are a handful; a stylesheet that no longer applies is not a saving.

Still have questions?

If you can't find the answer you're looking for, feel free to contact our support team.

Secure & Instant CSS Minifier for Developers

Privacy Focused

Instant Results

No Signup

Browser Based