CSS Minifier
Minify and beautify CSS instantly. Strip comments, whitespace, and redundant semicolons — or pretty-print minified CSS back to readable format.
About this tool
This tool shrinks CSS by removing comments, whitespace, and redundant semicolons (minify mode), or expands minified CSS back into indented, readable lines (beautify mode). Switch modes with the toggle above the input and the output updates live. Pick your indent size — 2 spaces (default), 4 spaces, or tabs — in beautify mode.
Example — minify: .btn { color: red; } becomes .btn{color:red}. Beautify reverses it: multi-selector rules like h1,h2,h3{color:red} are split onto separate lines, and @media / @keyframes blocks are properly indented.
String values inside content or font names are preserved during transformation. The byte counter shows how much the output shrunk (or grew) versus the input.
FAQ
How much does minifying CSS reduce file size? ›
Usually 15–40%, depending on how many comments, indentation, and whitespace the source had. Already-minified CSS shrinks very little.
Does the minifier rewrite my selectors or remove unused rules? ›
No. It only removes whitespace, comments, and the trailing semicolon before a closing brace. Selectors, properties, and values are left untouched — nothing structural changes.
What does "beautify" do to multi-selector rules and @-rules? ›
Beautify mode splits comma-separated selectors (h1, h2, h3) onto their own lines and properly indents @media, @keyframes, and @supports blocks — their contents are nested one level deeper. @import and @charset rules stay at the top level.
What does "beautify" do to comments? ›
In beautify mode comments are preserved and placed on their own line, so you can read developer notes. In minify mode all comments are removed entirely.