All tools CSS Minifier ● Live Developer Tools

How CSS Minifier works

  1. Paste your CSS into the Input box — a single rule or a full snippet with multiple selectors.
  2. The Output panel updates instantly with comments removed and whitespace collapsed.
  3. Check that the minified result still parses correctly by eye — this is a text transform, not a CSS validator.
  4. Click Copy to grab the compact version for an embed, prototype, or inline style block.
  • Shrink a CSS snippet before embedding it inline in an HTML email or a CMS widget with a size limit.
  • Compact a quick style prototype for sharing in a code review comment or Slack message.
  • Reduce the size of a small third-party CSS override before pasting it into a customer's site.
  • Strip development comments out of a CSS file before a one-off deployment without setting up a build pipeline.

Your CSS is minified entirely in your browser using local regular-expression processing — nothing is uploaded or sent to a server.

  • This is a whitespace-and-comment minifier only — it doesn't shorten color values, merge duplicate selectors, or remove unused rules.
  • It's not a CSS validator; syntactically broken CSS will be minified as-is without any error reported.
  • For production-scale stylesheets, a build-time minifier integrated into your bundler will produce smaller, more thoroughly optimized output.

CSS Minifier

CSS Minifier compresses pasted CSS snippets for embeds, prototypes, and quick shipping. It removes comments and unnecessary whitespace locally in the browser.

CSS Minifier Runs locally

CSS Minifier

Remove comments and extra whitespace from CSS snippets. Everything runs locally in this tab.

Output
.button{color:white;background:#1a73e8;}
Guide

How to use

  1. Paste your CSS into the Input box — a single rule or a full snippet with multiple selectors.

  2. The Output panel updates instantly with comments removed and whitespace collapsed.

  3. Check that the minified result still parses correctly by eye — this is a text transform, not a CSS validator.

  4. Click Copy to grab the compact version for an embed, prototype, or inline style block.

Scenarios

Use cases

  • Shrink a CSS snippet before embedding it inline in an HTML email or a CMS widget with a size limit.

  • Compact a quick style prototype for sharing in a code review comment or Slack message.

  • Reduce the size of a small third-party CSS override before pasting it into a customer's site.

  • Strip development comments out of a CSS file before a one-off deployment without setting up a build pipeline.

Good to know

Limitations & Privacy

Private by design

Your CSS is minified entirely in your browser using local regular-expression processing — nothing is uploaded or sent to a server.

  • This is a whitespace-and-comment minifier only — it doesn't shorten color values, merge duplicate selectors, or remove unused rules.

  • It's not a CSS validator; syntactically broken CSS will be minified as-is without any error reported.

  • For production-scale stylesheets, a build-time minifier integrated into your bundler will produce smaller, more thoroughly optimized output.

FAQ

Frequently asked questions

Is CSS Minifier free to use?

Yes. The tool is free and runs directly in your browser with no account required.

Does this tool upload my data?

No. Processing happens locally in the browser tab. Your input is not sent to a server.

What is this tool best for?

Shrinking a small CSS snippet for a code embed, style prototype, or quick inline <style> block before shipping it.

What exactly does it remove?

It strips /* comments */, collapses all whitespace and line breaks into single spaces, and removes the space around { } : ; , and > characters.

Does it rename or shorten CSS variable names, hex colors, or class selectors?

No. This is a whitespace-and-comment minifier only — it doesn't shorten hex colors (like #ffffff to #fff), merge duplicate rules, or rename custom properties the way a build-tool minifier like cssnano would.

Is it safe for production stylesheets?

It's designed for small snippets, embeds, and prototypes. For a full production build, a build-time minifier integrated into your bundler will catch more optimizations and is easier to keep in a repeatable pipeline.

Will it break CSS that relies on specific whitespace, like content properties?

Whitespace inside string values (e.g. content: " ";) is preserved since the minifier only touches whitespace between selectors and declarations, not inside quoted strings.

Can I paste an entire stylesheet, or just single rules?

Either works — there's no artificial size limit, though very large stylesheets are better handled by a build-tool minifier that can also merge and dedupe rules.