About this tool
Format and minify CSS quickly in the browser.
This CSS tool parses a stylesheet into a real node tree and then prints it two ways: formatted with one declaration per line, or minified to a single line with comments and whitespace removed. Because it scans characters rather than matching regular expressions, it handles the cases that break naive minifiers — semicolons inside url(data:image/svg+xml;base64,…), braces inside quoted content values, and commas inside :is() and :not(). It is for front-end developers who want a quick, offline tidy-up or size check without wiring up a build step.
Open CSS Tools on AltFTool — it loads instantly in your browser.
Paste your stylesheet into the CSS input box — it opens with a sample app.css stylesheet already loaded.
Choose a Mode: Minify for production, or Format for reading, which enables the Indent (format mode) select for 2, 4 or 8 spaces.
Tick Keep /*! licence comments or Drop empty rules when minifying, read the Rules, Declarations, Comments found and Bytes saved figures, then press Copy CSS — or Reset to restore the sample.
Only whitespace and comments are removed — no property value is rewritten, so rendering cannot change.
Comments opening with /*! are kept, matching the convention terser and cssnano follow.
The stylesheet never leaves the browser, so unreleased design work stays private.
Whitespace and comment removal alone typically cuts 15-30% off a hand-written stylesheet — the exact figure is shown for your input. On top of that, gzip or Brotli on the server usually removes another 70-80%, and the two compound, so minified plus gzipped is where the real saving is.
Not here. This tool only removes whitespace, comments and empty rules; it never merges rules, shortens colours, drops units or reorders declarations. Those transforms are where aggressive minifiers occasionally change rendering, so they are deliberately left out.
Because a data URI legally contains semicolons — url(data:image/svg+xml;base64,…) — and a regex that splits declarations on ; cuts it in half. A real parser tracks parenthesis depth and string state, which is why this tool leaves the URI whole.
Yes, when the option is ticked. A comment whose first character is an exclamation mark is the long-standing convention for a header that must survive minification, and it is honoured by terser, UglifyJS and cssnano too. Ordinary /* … */ comments are dropped.