Paste CSS
Add your stylesheet or a snippet.
Code & Data Tool
CSS Formatter
Format CSS and inspect selectors, declarations, media queries, and colors.
Loading workspace...
About this tool
What is CSS Formatter?
CSS Formatter reformats stylesheets with consistent indentation and shows what is inside them: selectors, declarations, media queries and colours. It is useful for reading minified CSS or cleaning up a stylesheet from a class project.
Useful when you need to
- Read minified CSS from a website
- Tidy a stylesheet before submitting
- Count selectors and media queries
How to use
How to use CSS Formatter
01 02 Format
Run Format to indent rules and declarations.
03 Inspect
Look at the summary of selectors, media queries and colours.
04 Copy
Copy the clean CSS.
Tips
Get better results
- Formatting does not remove unused rules.
- If the result looks wrong, check for a missing brace using the CSS Validator.
FAQ
Frequently asked questions
Does it change how my CSS works?
No, only whitespace and layout of the code change.
Can it handle media queries?
Yes, they are detected and reported.
Is my code uploaded?
No. It stays in your browser.
More practical guides · File handling and privacy · Report an incorrect instruction