Your data is never sent to a server or stored anywhere. All processing happens in your browser.

CSS Formatter

Indent
Formatted output
 

How to Use


Paste CSS into the input area and indentation, line breaks, and spacing are normalized automatically. Pick 2- or 4-space indent. Use the copy button to grab the formatted output.

What Formatting Does


Bundler-minified CSS and quickly-pasted snippets aren't readable as-is. The tool indents according to `{ ... }` nesting depth, breaks lines after `;`, and adds spaces after `:` and `,`. Property values are not rewritten — there's no hex-to-rgb conversion or shorthand expansion.

Use Cases


  • Decoding bundler-output minified CSS to understand it
  • Expanding long inline styles to read their contents
  • Normalizing third-party CSS before reviewing it
  • Spot-checking the structure of your own CSS while writing
  • Tidying up CSS snippets before pasting them into a blog post or chat

Privacy


All formatting is done locally in the browser; the CSS content never leaves your device. Even internal stylesheets stay private — there is no transmission to any server.

FAQ


What is the difference between the CSS formatter and the CSS minifier?

The formatter adds indentation and line breaks to compact CSS to make it readable. The minifier does the opposite — it strips whitespace and comments to shrink file size. Use the formatter when you want to read it and the minifier when you want to ship it.

Is the CSS I paste sent to a server?

No. All formatting happens in your browser, and the CSS content is never sent to a server or stored. You can safely format internal stylesheets.

Does it rewrite property values?

No. The tool only normalizes indentation, line breaks, and spacing — it never changes property values. There is no hex-to-rgb conversion or shorthand expansion, so the rendered behavior stays exactly the same.

Can I choose the indent width?

Yes. You can pick a 2-space or 4-space indent so the output matches your project's coding conventions.

Can it format single-line minified CSS?

Yes. Even CSS crammed onto one line, like bundler-minified output, gets indented according to `{ ... }` nesting depth and broken onto new lines after each `;` so it becomes readable.