Skip to content
Seitensicht
Tools & navigation

Format CSS

Make compressed CSS readable, or minify it for delivery. Everything runs in your browser, without uploads.

Unordered style rules become structured blocks of source text next to a designed website.

How it works

Order or reduce style sheets

  1. Paste CSS
  2. Select formatting
  3. Copy readable or compact output
What is going to happen?

What to Consider

The parser reads character by character instead of using a regular expression. This matters because Content: "}" or in one of the url(data:...;base64,...) may contain braces and semicolons that are not structural. Simple pattern matching would split the file incorrectly.

Each selector is placed on its own line, making it easier to see what a rule affects and avoid unintended side effects.

Minification removes comments, except those beginning with /*! which identify licence notices that need to be preserved.

To find unused CSS and its effect on loading time, use the measurement in the Website check .

Where the weight really comes from

Minification saves characters, not rules. Large stylesheets often come from themes or builders that deliver far more CSS than the page uses. The solution is removing unused rules, not just formatting.

Loading order also matters: a stylesheet blocks rendering until it has loaded. Nobody notices whether it is 40 or 45 kilobytes; its placement in the head and the number of other files do matter.

What is retained in the shrinkage

Comments and whitespace are removed, as is the final semicolon in each block. Strings inside Content, values in url() and media queries are preserved, because removing spaces can change their meaning. Custom properties are preserved too, including --variableswhich make up modern themes.