DockittDockitt

CSS Minifier Online — Free CSS Compressor

Minify and compress CSS online. Removes comments and whitespace. Shows size reduction. Free, browser-based.

Runs entirely in your browser — no data leaves your device
No account, no signup, completely free
Instant results — no waiting for server processing
Works offline once the page is loaded
Runs entirely in your browser. Your data never leaves your device — no server, complete privacy.

Minifying CSS reduces the file size by removing comments, unnecessary whitespace, newlines, and redundant characters. Smaller CSS files load faster, reducing page load time and improving Core Web Vitals scores. This tool applies a series of pure JavaScript transformations to remove all unnecessary content while preserving the functionality of your styles. The original and minified sizes are displayed so you can see the improvement.

How to use

  1. Paste your CSS code into the input textarea.
  2. Click 'Minify CSS' to remove comments, whitespace, and redundant characters.
  3. Copy the minified CSS or download it as a .css file. The size reduction is shown below.

FAQ

What transformations does the minifier apply?

The minifier applies the following transformations in order: (1) Removes all CSS comments (/* ... */). (2) Removes leading and trailing whitespace from each line. (3) Collapses multiple consecutive spaces and tabs into a single space. (4) Removes newlines and carriage returns. (5) Removes spaces around the characters : ; { } , > + ~ =. (6) Removes the last semicolon before a closing }. (7) Removes spaces in certain at-rule expressions. These transformations reduce file size without changing the semantics of the CSS.

Is the minified CSS safe to use in production?

Yes, for standard CSS. The minifier performs simple textual transformations that do not change the meaning of the CSS. All selectors, properties, and values are preserved. The only content removed is whitespace and comments, which have no effect on the browser's rendering. For very complex or non-standard CSS (e.g., template strings or server-side interpolations), review the output before deploying.

Does the minifier handle CSS custom properties (variables)?

Yes. CSS custom properties (--primary-color: #2563eb) are preserved exactly as-is. The minifier does not modify property names or values — it only removes whitespace around the structural characters (: ; { }). Custom property values that contain spaces (e.g., --font-size: 16px) are preserved correctly.

Can I minify SCSS or Less?

No. This tool only handles standard CSS. SCSS (Sass) and Less are CSS preprocessors with syntax that extends CSS with variables, nesting, mixins, and other features. The minifier would incorrectly handle the preprocessor-specific syntax. To minify SCSS, compile it to CSS first (using the Sass compiler), then paste the compiled CSS output into this tool.

How much size reduction can I expect?

Size reduction varies by CSS content. Well-commented, well-formatted CSS with generous whitespace typically reduces by 20-40%. Minified results depend on the ratio of whitespace and comments to actual CSS content. CSS files that are already reasonably compact may only reduce by 10-15%. For comparison, popular CSS frameworks like Bootstrap reduce from approximately 200KB (source) to 150KB (minified) — about 25%.

Is my CSS sent to a server?

No. All minification runs entirely in your browser using pure JavaScript regular expressions and string operations. No data is sent to any server. This makes the tool safe for minifying proprietary CSS, confidential design tokens, or any other sensitive stylesheets.