CSS
Minifier
Remove comments, collapse whitespace, and optimize your CSS. Fast, free, and entirely in your browser.
How It Works
Paste CSS
Paste or type your CSS code into the input area.
Minify
Click Minify to remove comments and optimize whitespace.
Copy or Download
Copy the minified code or download it as a .css file.
Minify CSS online to ship smaller stylesheets, reduce render-blocking time, and improve Lighthouse performance scores. ConverterUp's CSS minifier strips comments, removes whitespace and line breaks, tightens spacing around braces, colons, semicolons and commas, and drops the last semicolon in each rule. Front-end developers, theme authors, and WordPress users can paste a stylesheet, copy or download the minified result, and serve it from their site or CDN. The processing happens entirely in your browser, so internal design systems and client stylesheets are never uploaded to a third party.
What gets compressed in a CSS file
Whitespace and newlines are removed everywhere they are not significant — between selectors, before braces, after semicolons, inside calc() expressions where the spec allows it. The final semicolon before } is dropped because CSS treats it as optional. A typical 50 KB hand-written stylesheet shrinks to 30–35 KB from whitespace removal alone.
Comments (/* ... */) are stripped, including license comments that start with /*! — if you must keep a copyright header, add it back to the top of the minified file.
Color shorthand (#FFFFFF to #FFF, rgb() to hex) is a further optimization done by build tools such as cssnano or Lightning CSS. ConverterUp leaves colors exactly as written, which keeps the output predictable.
Numeric shorthand (0.5em to .5em, 0px to 0), merging duplicate selectors and collapsing margin: 10px 10px 10px 10px are also build-tool optimizations. ConverterUp focuses on safe whitespace and comment removal and does not rewrite values or selectors.
What this minifier changes — and what it leaves alone
ConverterUp applies only whitespace and comment transformations, so the computed styles are identical in every browser. The output is structurally compact but semantically the same as the input.
Deeper rewrites — merging rules with shared declarations, dropping outdated vendor prefixes, reordering declarations for better gzip — belong in a build tool like cssnano or Lightning CSS, where they run with full knowledge of your browser targets.
It does not remove unused selectors (that requires DOM analysis — use PurgeCSS), does not change specificity or selector order, does not inline custom properties (a --brand-primary stays a variable so runtime theme switching works), and does not touch vendor prefixes.
Real-world savings: a 100 KB unminified design-system CSS typically goes to 60 KB minified, 18 KB gzipped, 14 KB brotli. That last number is what the browser actually downloads on a modern HTTPS connection. Minification helps the parser unpack faster more than it saves bandwidth — gzip already deduplicates most of the whitespace wins.
Critical CSS vs full minify
Critical CSS is a different optimization than minification, often confused with it. Critical CSS extracts only the rules needed to render the above-the-fold content of a specific page, inlines that into a <style> tag in <head>, and lazy-loads the full stylesheet. This eliminates the render-blocking round trip and improves Largest Contentful Paint by 200–800 ms on slow connections.
You want both. Critical CSS reduces the bytes that block render. Minification reduces every byte. Combine them: extract the critical subset (12–20 KB raw), minify it, inline it. Load the rest of the stylesheet asynchronously with <link rel='preload' as='style' onload='this.rel="stylesheet"'> or modern media='print' onload='this.media="all"' hacks.
Tools for critical CSS: critters (used by Next.js when experimental.optimizeCss is on), critical (Penthouse-based, by Addy Osmani), beasties (active fork of critters). For static sites, run critical-CSS extraction per route at build time. For SSR apps, do it per page on first request and cache the result.
When critical CSS is overkill: small sites with a single global stylesheet under 30 KB. Inlining the whole thing is simpler than splitting it and the LCP gain is marginal. Critical CSS pays off when the full stylesheet is >50 KB and the home page only needs 15 KB of it.
Frequently asked questions
How much can CSS usually be reduced?
Expect 20-40 % size reduction on typical stylesheets. Combined with gzip or brotli compression on the server, most sites end up serving CSS under 30 KB even for full design systems.
Are CSS variables and modern features supported?
Yes. Custom properties, calc(), nested at-rules, container queries, and CSS Layers are all kept, because only whitespace and comments change. Vendor prefixes are kept untouched so cross-browser compatibility is not affected.
Does it remove unused selectors?
No. The minifier focuses on safe size reduction. Removing unused selectors requires knowing which HTML actually uses them, which only a tool like PurgeCSS can do during build time.
What is the maximum stylesheet size?
There is no fixed limit; realistic design-system stylesheets minify instantly. Most production stylesheets are under 200 KB before minification.
Does the minifier create source maps?
No. Source maps come from build tools (Sass, PostCSS, Vite, webpack) that know your original files. Use ConverterUp for quick one-off minification and keep source maps in your build pipeline.
Why does my minified CSS sometimes look smaller than expected?
The most likely cause is that your input already contains few comments and little whitespace — typical of CSS that went through Sass or PostCSS, which produces semi-compact output even without an explicit minify step. The minifier still trims further, but the marginal gain on already-compact CSS is 5–10 % rather than the typical 30 %. Compare bytes pre- and post-gzip for a realistic comparison; the wire savings are usually similar regardless.