A stylesheet written for humans to read is full of characters a browser never needs: indentation, blank lines between rule blocks, a comment explaining why a hack exists, and a trailing semicolon before a closing brace. None of that affects rendering, so removing it is one of the safest size reductions available, unlike renaming a class name or reordering rules, which can change which selector wins a specificity conflict.
The whole process runs in your browser using a character scanner, so a stylesheet with unreleased branding or a client's design system never has to leave your machine to get smaller. That makes it a genuinely private way to minify css online before it ships.
What this css minifier changes, and what it protects
It removes every /* comment */ block, collapses runs of whitespace to the minimum needed between tokens, drops the semicolon immediately before a closing brace since it is redundant there, and trims the space around colons, commas and braces where CSS allows it without changing meaning. Together these typically cut 20 to 40 percent off a readable, well commented stylesheet.
It never touches the content of a string or a url value, both of which can legitimately contain the same characters the minifier is scrubbing everywhere else, including semicolons, colons and comment-like sequences inside a data URI or a font file path. Corrupting either of those is the classic failure mode of a naive minifier, and this scanner is specifically built to avoid it.
- Removes every comment block, including one spanning multiple lines.
- Collapses whitespace between selectors, properties and values to a single space or nothing.
- Drops the final semicolon in a declaration block, which CSS treats as optional there.
- Never alters characters inside a quoted string or a url() value.
- Leaves selector names, property names and values themselves completely unchanged.
Why strings and url values need special handling
A font stack often quotes a family name containing a space, and a background image is set with a url() function that frequently contains a full path with slashes, query parameters and sometimes even a base64 encoded data URI packed with characters that look like CSS syntax to a careless minifier. A regex based approach that blindly strips whitespace or looks for semicolons to remove will corrupt any of these if it does not first recognise that it has entered a string or a url() and needs to stop touching characters until that string or function call closes.
This css minifier tracks that context explicitly. While scanning inside a single quoted string, a double quoted string, or the parentheses of a url() function, every character is copied through exactly as written, and the whitespace and semicolon collapsing rules that apply everywhere else are suspended until the string or function closes.
Semicolon collapsing and the one rule that makes it safe
CSS treats the semicolon before a closing brace as optional, since the brace itself already marks where the last declaration ends. Removing that final semicolon is completely safe and is one of the more reliable size savings a css minifier can make, because it depends only on local context: a semicolon immediately followed by a closing brace, outside of a string, can always be dropped.
Every other semicolon in the file stays exactly where it is, since removing one that separates two real declarations would merge them into invalid CSS. The scanner only ever removes a semicolon when it can prove, from the very next non whitespace character, that doing so is safe.
How this css minifier works under the hood
The tool walks the stylesheet one character at a time, the same approach the companion javascript minifier and html minifier on this site use, keeping track of whether it is inside a comment, a string, a url() value or plain CSS. Whitespace, comments and the trailing semicolon are only removed while the scanner is in the plain CSS state.
That character by character approach, rather than a single global regular expression, is what lets this tool remove css comments and collapse whitespace across an entire file without a parser and without ever mistaking the inside of a url or a quoted font name for CSS syntax that is safe to touch.
How to minify CSS
- 1
Add your stylesheet
Paste CSS into the input box, or drop a .css file onto the page. Nothing is uploaded.
- 2
Review the options
Comment removal and whitespace collapsing are both on by default and can be toggled independently.
- 3
Minify
Run the scanner and check the before and after size in the stats panel.
- 4
Copy or download the result
Copy the minified CSS to your clipboard or download it as a .css file.
Related tools worth bookmarking
Sources and further reading
- MDN: CSS syntaxThe reference this scanner follows for how selectors, declarations, strings and comments are structured in CSS.developer.mozilla.org
- W3C: CSS Syntax Module Level 3The formal specification defining how a CSS parser tokenises strings, url() functions, comments and whitespace.w3.org
- web.dev: Minify CSSGoogle engineering guidance on why removing comments and whitespace from CSS improves page load performance.web.dev
Frequently asked questions
Common questions about the css minifier.
No. The scanner recognises the opening of a url() function and copies everything inside its parentheses through untouched, including a long base64 encoded data URI, until the closing parenthesis. Whitespace and comment removal only apply outside of that context.
No. Selectors, their order in the file and their specificity are left completely unchanged, since removing comments and whitespace has no effect on how the CSS cascade resolves conflicting rules. Only characters that carry no meaning to the browser's parser are removed.
Yes. A quoted string such as font-family: "Open Sans" is tracked as a string literal by the scanner and copied through exactly as written, including the space inside the quotes, so quoted font names, content values and attribute selectors are never corrupted.
No. The minifier runs entirely in your browser using a local character scanner. Your stylesheet, including any unreleased design system or client work, is never transmitted, stored or seen by anyone but you.
A well commented, indented stylesheet typically shrinks by 20 to 40 percent from comment and whitespace removal alone. A file that already has minimal formatting will save less, since there is simply less redundant whitespace and fewer comments left to remove.
No. Rule merging, shorthand property combining and selector reordering all require understanding the meaning of the CSS, which a character scanner does not attempt. This tool only removes characters that a browser's CSS parser would ignore, which keeps the transformation provably safe.