Minify CSS
Compress CSS by removing comments and unnecessary whitespace to reduce file size.
Example
Input:
/* card */
.card {
margin: 0 auto;
color: red ;
}Output:
.card{margin:0 auto;color:red}How it works
Paste CSS in the input pane and it minifies live. The tool removes /* comments */, collapses whitespace, and trims spaces around braces, colons, semicolons, and combinators.
Good to know
Minify CSS takes a readable stylesheet and rewrites it into the smallest equivalent text by stripping comments, collapsing runs of whitespace into single spaces, and removing the spaces around structural characters like braces, colons, semicolons, and the combinators >, ~, and +. It also drops the redundant semicolon before each closing brace and normalizes !important spacing. It is aimed at front-end developers, and anyone who needs to shave bytes off a stylesheet before shipping it without changing how the page renders.
Reach for it when you are hand-editing a small CSS file, a critical-CSS snippet you inline in the <head>, or a one-off override that your build pipeline does not process. It is also handy for quickly checking how compressible a stylesheet is, or for tidying machine-generated CSS before pasting it somewhere. Because everything runs locally in the browser, you can safely paste proprietary or unreleased styles without them leaving your device.
The status line reports the result as original -> minified bytes plus a percentage smaller. Read that percentage as the raw text reduction only; real-world transfer savings are usually lower once gzip or Brotli compression is applied by your server, since those algorithms already squeeze repeated whitespace. A modest percentage here does not mean the work was wasted, and a high one does not always translate to the same gain over the wire.
One caveat: this is a lightweight, regex-based minifier, so it focuses on whitespace, comments, and trailing semicolons rather than deeper optimizations like merging duplicate selectors, shortening hex colors, or removing unused rules. Avoid pasting CSS that contains content depending on literal spacing, and keep an unminified master copy for editing, since minified output is meant for delivery, not for maintenance.
Frequently asked questions
Does minifying CSS change how my styles render?
No. This tool only removes comments and unnecessary whitespace plus the final semicolon before each closing brace. The selectors, properties, and values are untouched, so the rendered result is identical.
Is my CSS uploaded anywhere?
No. Minification runs entirely in your browser with JavaScript. Nothing is sent to a server, so it is safe to paste private or proprietary stylesheets.
Is my data uploaded anywhere?
No — this tool runs entirely in your browser. Your input never leaves your device and it works offline once loaded.
Is it free?
Yes, completely free with no sign-up and no limits.
People also ask
Does minifying CSS actually make a website faster?
It reduces the raw file size, which can lower download time and parsing work, but the gain is usually small once gzip or Brotli compression is enabled on the server, because those already compress whitespace. The benefit is most noticeable on inlined critical CSS and on connections without server-side compression.
What is the difference between minifying and compressing CSS?
Minifying rewrites the source to remove unnecessary characters like comments and whitespace while keeping it valid CSS. Compressing (gzip or Brotli) is a transport-layer encoding applied by the server that shrinks the bytes further during transfer and is decoded by the browser; the two are complementary.
Can I un-minify or reverse minified CSS back to readable code?
There is no exact reversal because the original comments and formatting are gone, but a CSS beautifier or prettifier can re-add line breaks and indentation to make it readable again. This tool only minifies, so keep an unminified copy if you need to edit later.
Does this tool remove unused CSS rules?
No. It only strips comments, whitespace, and redundant trailing semicolons. Removing unused selectors requires analyzing your HTML and JavaScript, which dedicated tools such as PurgeCSS or coverage tools in browser dev tools handle.
Will minifying CSS break my media queries or !important rules?
No. Whitespace inside selectors, property values, and at-rules like media queries is normalized but kept meaningful, and !important is preserved (its spacing is just standardized). The rendered output should be identical to the source.
Is there a file size limit for the CSS I can minify here?
There is no fixed limit since processing happens in your browser, but very large stylesheets are bounded by your device's memory and may feel slow as you type. For multi-megabyte files, a build-tool minifier is typically a better fit.
Should I minify CSS by hand or let my build tool do it?
If you already use a bundler or build pipeline, it usually minifies CSS automatically, so manual minification is best for ad-hoc snippets, inlined critical CSS, or files outside your build. Doing both is redundant but harmless.
Related tools