Input
Output

About the CSS formatter

Bytewrench's CSS formatter beautifies messy or minified stylesheets into clean, consistently-indented rules — one declaration per line, a space after each colon, and nested at-rules like @media and @supports indented properly. Switch to minify to strip comments and whitespace for production.

It preserves strings, data URIs and comments, works with any CSS including modern syntax, and runs entirely in your browser.

Beautify & minify

Pretty-print with 2/4-space or tab indentation, or compress to a single line.

🧱
Nested at-rules

Indents @media, @supports and keyframe blocks correctly.

🧩
Safe with data URIs

Leaves url(data:…) values, strings and comments intact.

🔒
Local & private

Your CSS is formatted in the browser and never uploaded.

Frequently asked questions

Does minifying CSS change how it renders?

No. Minify only removes comments and unnecessary whitespace; the rules and their order are unchanged, so the rendered result is identical.

Will it break url(data:…) or @media queries?

No. Data URIs, quoted strings and at-rules are preserved; only formatting whitespace is adjusted.

Does it autoprefix or optimise my CSS?

No. It only reformats — it doesn't add vendor prefixes, merge rules or remove unused styles. Use a build tool for those.

Is my CSS sent to a server?

No. All formatting happens locally in your browser.