CSS formatter

Input
Output

CSS Formatter

Turn minified or messy CSS into one declaration per line, with nested SCSS and Less rules indented and media queries laid out. It runs Prettier in your browser.

How do I use the CSS formatter?

  1. Paste CSS, SCSS or Less.
  2. Pick the language, the indent and the quotes.
  3. Copy the result or save it.

What does the CSS formatter do?

  • CSS, SCSS and Less
  • Prettier 3 formatting
  • Single or double quotes
  • 2 spaces, 4 spaces or tabs
  • Errors with the line and column

Frequently asked questions

Is my code uploaded?
No. The formatter runs in your browser; your code stays on your device.
Why does it take a moment the first time?
The formatter loads only when you use it, and only the parts your language needs. After that your browser keeps it.

More JSON tools

Bracely has 97 JSON tools in one page. Related ones:

Runs entirely in your browser. Nothing you paste is uploaded. Made by Saurabh Pagrut · About · Privacy policy
Last updated · Version 5.4 · Changelog
Saurabh Pagrut on GitHub · LinkedIn · X · YouTube · Instagram