This tool reindents CSS for reading and compresses it for shipping. The compression is where care is needed: a URL can legally contain the characters that start a comment, and a content string can contain runs of spaces that matter. A minifier that treats the whole file as one long string destroys both, so this one identifies strings and url() values first.
Runs entirely in your browser — nothing you paste is uploaded.
How to
Type, paste, or load a .css file. The result updates as you type.
Beautify puts each declaration on its own line. Minify strips every unnecessary byte while leaving quoted values alone.
Comments can be removed when minifying. Licence comments beginning /*! are kept regardless, which is the usual convention.
The byte counts show what you saved. Copy the output or download it as a file.
Examples
A minifier that strips anything between /* and */ removes the middle of this URL and leaves a broken path. Recognising url() as a unit prevents that.
Those spaces are rendered on the page, so collapsing them changes the design. Quoted strings are copied through unchanged.
The /*! form conventionally marks a comment that must survive minification for licensing reasons, so it is kept while ordinary comments go.
Why use it
Quoted strings and url() values are identified before any whitespace or comment removal, so their contents come through byte for byte.
The /*! convention is respected, so minifying does not strip an attribution you are required to keep.
Byte counts before and after tell you whether the minification was worth doing for this particular file.
Unreleased stylesheets are not uploaded anywhere, and the tool works with no network connection.
Good to know
Summary
FAQ
Discover