CSS formatter (indent and beautify)
Format minified or messy CSS online: one property per line, 2 or 4 space or tab indentation, a blank line between rules and separate selectors, so you can read and edit any site's styles.
How to usePaste your CSS.
CSS formatter (indent and beautify): what it is for
.min.css files come on a single line to load fast, but that way nobody can read them. Paste the CSS and each rule and each property gets its own line, with the indentation you choose.
There are options for a blank line between rules and one selector per line. It also works with most SCSS and Less. To go back to the small file, use the Minify CSS tool. Everything runs in the browser with the js-beautify library.
How to use
- Paste the CSS.
- Choose the indentation and options.
- Copy or download the result.
When to use it
- Studying a site's styles.
- Editing minified CSS.
- Standardizing a project's indentation.
Frequently asked questions
Does it work for minified CSS?
Yes. That is the most common use: a .min.css file comes on a single line, and the tool splits each rule and each property so you can read and edit it.
Does it work with SCSS and Less?
Mostly, yes: nested rules, variables and mixins are indented correctly. To be safe, compare the result with the original before replacing the file.
How do I make the CSS small again?
Use the Minify CSS tool, which does the opposite: it removes spaces, line breaks and comments so the file loads faster.
Is it really free?
Yes, 100% free. No sign-up, no subscription and no usage limits. All Tools123 tools are free and run right in your browser.