Make your CSS code readable, structured, and easy to maintain
Proper indentation makes CSS easier to understand and maintain
Spot syntax errors and structural issues at a glance
All processing happens locally in your browser
Choose between 1‑5 spaces to match your style guide
Transform messy, minified, or poorly indented CSS into clean, readable code.
Our CSS formatter processes your code with these steps:
The code is parsed into a structured tree (rules, selectors, declarations).
Rules are indented based on nesting, using the number of spaces you selected.
The result is a beautifully formatted CSS block, ready for review or editing.
@media (max-width:350px){.bd-examples{margin-left:-.50rem;margin-right:-.50rem}.bd-examples>[class^="col-"]{padding-right:.50rem;padding-left:.50rem}}@media (max-width:350px) {
.bd-examples {
margin-left: -.50rem;
margin-right: -.50rem
}
.bd-examples>[class^="col-"] {
padding-right: .50rem;
padding-left: .50rem
}
}