CSS Formatter
Beautify minified or messy CSS with proper indentation and line breaks
Frequently Asked Questions
How does the CSS formatter handle media queries? +
The formatter correctly handles nested structures like @media queries, @keyframes, and @supports blocks. Rules inside these at-rules are indented one level deeper than the at-rule itself, keeping your stylesheet well-organized.
Is my CSS sent to any server? +
No. All formatting runs entirely in your browser using JavaScript. Your CSS never leaves your device — nothing is uploaded, stored, or transmitted.
What do the stats mean? +
After formatting, the tool shows two stats: the number of selectors (CSS rules like .class, #id, or element selectors) and the number of properties (individual style declarations like color, margin, etc.) found in your stylesheet.
Can I format SCSS or LESS with this tool? +
This tool is designed for standard CSS. While it may partially format SCSS or LESS due to their similar syntax, nested selectors and special syntax like variables or mixins may not be handled perfectly. Use a dedicated SCSS/LESS formatter for those.
What indent options are available? +
You can choose between 2 spaces, 4 spaces, or tabs for indentation. Pick your preferred style from the dropdown and click Format — you can change it and re-format at any time.