CSS Formatter & Minifier

Paste a stylesheet to format it with consistent indentation, or minify it for production. It runs entirely in your browser, so nothing is uploaded.

CSS Formatter & Minifier 100% CLIENT-SIDE

Input CSS

0 chars

Formatted Output

Textual reflow — no CSS parsing

More from CSSTidy

CSS Specificity Calculator Paste selectors or a whole stylesheet to get each selector's (ids, classes, types) specificity, ranked by… Tool PX to REM Converter Convert every px value in a stylesheet to rem, or rem back to px, using your own base font size. Tool

Guides

CSS Selectors in Practice CSS Cheat Sheet CSS Patterns and Gotchas CSS Minification Best Practices Beautify Is Not Format CSS Formatters and Minifiers Compared

All tools →All 21 guides →

Embed this tool on your site

Paste this where you want the tool to appear. It renders CSSTidy inside your own page — no ads in the embed, no input stored, and it links back to csstidy.net so visitors can reach the full page.

<iframe src="https://csstidy.net/embed/" title="CSSTidy — CSS Formatter" width="100%" height="560" loading="lazy" style="border:1px solid #d0d7de;border-radius:10px;max-width:100%;"></iframe>

Frequently Asked Questions

Is my data sent to a server?

No. All formatting and conversion runs entirely client-side in your browser.

Will minifying my CSS change how it renders?

Not for valid CSS. Minification removes whitespace, comments, and redundant semicolons. It can change output if the original relies on a CSS hack that depends on comment or whitespace placement, so keep the unminified source as the thing you edit.

Can I use CSSTidy to reformat someone else’s stylesheet?

Yes. Paste it and use the formatter to restore indentation and one-declaration-per-line layout. The tool rewrites formatting only, never selectors or values.

🧭 Pro Tips & Gotchas

What tidy/minify do

Tidy is textual: ; becomes a newline, } becomes a newline, indentation follows brace depth. Comments and strings survive as-is.
Minify strips / / comments and collapses whitespace around {};:, — enough to shrink the file, not enough to rename anything.

CSS gotchas worth knowing

Minification cannot tell a comment from content inside a string. content: "a/b/c" and font: 12px/1.5 "Arial/x/" are the shapes that break: the second contains a shorthand line-height that a naive comment-strip mangles.
IE's _property hacks and *property hacks depend on exact whitespace and can survive or vanish depending on the minifier. Test the minified output, never assume equivalence.
Semicolon-less @import and missing trailing semicolons are errors, not style preferences — @import url(x) @media parses as nothing at all. Some minifiers will happily drop a "redundant" final semicolon and change the cascade.
Duplicate selectors are not merged by any formatter and only sometimes by aggressive minifiers; relying on that is how "it works minified but not dev" bugs appear.
Source order is semantics in CSS. A formatter that sorts or groups rules for tidiness has changed your specificity outcome — no tool here sorts rules, but check any "organise" feature before trusting it.
!important in a minified bundle is undebuggable without source maps: generate them (cssnano keeps them cheap) or you are reading a 200 KB single line.

Better tools when it matters

Lightning CSS (Rust, ~40× faster than PostCSS, does vendor-prefixing and minification safely), cssnano for a PostCSS pipeline, Stylelint for the formatting rules you actually want enforced in CI. All three parse properly, so none of them can corrupt a content: string.