CSS Minifier
Minify CSS in the browser.
About this tool
Strip comments and unnecessary whitespace from CSS to shrink payload size. Useful for quick checks; production builds usually minify in the bundler.
How to use
Paste readable CSS, run Minify, compare byte size mentally, then use your build pipeline for the real release artifact.
Example
Example includes a comment that minification removes.
Input
.hero {
/* homepage band */
padding: 4rem 1.5rem;
background: #0f172a;
color: #e2e8f0;
}
Output
.hero{padding:4rem 1.5rem;background:#0f172a;color:#e2e8f0}
Tip
Do not minify as your only source of truth — keep a formatted original in git.
Good to know
How much smaller will my CSS get?
It depends on how much whitespace and how many comments the source has — heavily commented, indented CSS shrinks the most. This tool only strips whitespace and comments; a build-time minifier can also merge and shorten rules, so use it for the real release.
Can minifying break my styles?
Whitespace around descendant selectors such as “nav :first-child” is kept, because removing it would change the meaning. Comments are removed, including license banners.