CSS Minifier
Minify a stylesheet in your browser: comments, whitespace and trailing semicolons out, strings and url() kept intact.
Minify CSS
Runs in your browser. Strings and url() values are copied through unchanged; rules are never merged or reordered.
Minified CSS
What the CSS Minifier does
A stylesheet blocks rendering: the browser will not paint anything until the CSS it references has arrived and been parsed. Shaving bytes from it moves the first paint earlier on every visit. This minifier removes the comments, line breaks, indentation and the last semicolon in each block, then applies a few safe shortenings: lengths of 0px or 0em become 0, and six-digit colours with repeated pairs (#ffffff) become their three-digit form (#fff).
It never rewrites anything inside a string or a url() value, so a background image path with spaces or a content property with punctuation comes out exactly as it went in. Comments that start with /*! are kept, which is the convention for licence headers that must travel with the code. Selectors, property names and values are not reordered or merged, so the cascade is unchanged.
Paste your CSS and read the size stats. Nothing is uploaded; the work happens in the page. For a build pipeline you will want this step automated, but for a one-off stylesheet on a landing page or a WordPress child theme this is enough.
Step by step
- 01Paste a stylesheet into the input. Several files can be pasted one after another; the order is kept.
- 02Keep the default options or turn off colour and zero shortening if your CSS is later processed by a tool that is strict about the original values.
- 03Compare the before and after sizes in the summary row.
- 04Copy the output or download it as a .min.css file and reference that file from your pages.
Common questions
Yes for the colour itself: both forms name the same value. The minifier only shortens hex colours whose three pairs are each doubled digits, and it skips anything inside strings and url() so a hash in a file name is left alone. Eight-digit colours with alpha are shortened to four digits in the same way.
Comments that begin with /*! are preserved on purpose. Libraries use that marker for copyright notices that their licence requires you to keep. Every other comment is removed.
The transformations here are limited to whitespace, comments, trailing semicolons and two value shortenings that do not change meaning. Rules are not merged and nothing is reordered. If a rule depended on a comment hack for an old browser, that hack is gone, but such hacks have had no supported browser for years.
Hand-written CSS with comments and indentation loses 20 to 40 percent. Output from Tailwind or a preprocessor that already minifies loses almost nothing. Compression on the server (gzip or brotli) is the larger saving and works alongside minification.
Keep checking
HTML Minifier
Strip comments and collapse whitespace in HTML without touching pre, textarea, script or style blocks.
Free toolJavaScript Minifier
Remove comments and blank space from JavaScript while leaving strings, templates and regexes untouched.
Free toolSVG Optimizer
Clean an SVG in your browser: editor metadata, comments, empty groups and long decimals out, preview before and after.
Free toolImage Lazy Load Generator
Add loading="lazy" and decoding="async" to your img tags, keep the first ones eager, with an IntersectionObserver fallback.
Want these fixes done for you?
Our team runs the audit, makes the changes and reports the result.