CSS Formatter
Beautify and format compressed or minified CSS
cssformatbeautifyprettify
CSS Formatter
Formatting Rules
- Each CSS rule block starts on a new line with the opening brace on the same line as the selector
- Each property declaration is indented with 2 spaces
- Closing braces appear on their own line
- Comma-separated selectors are split onto separate lines
- At-rules like
@mediaand@keyframesare handled with nested indentation - Comments are stripped during formatting
Learn more
Step-by-step guide
How to Format and Beautify CSS
Step-by-step guide to auto-formatting compressed or messy CSS into a clean, readable style using the DevHexLab CSS Formatter.
In-depth article
CSS Code Style and Formatting: Best Practices
Well-formatted CSS is easier to maintain and review. Learn CSS formatting conventions, property ordering, and how to auto-format any stylesheet instantly.