Free Tool
CSS Formatter
Paste any CSS to instantly beautify it with one property per line and consistent indentation, or minify it to the smallest valid stylesheet for production.
CSS Formatter & Beautifier
Indent
What is a CSS formatter?
CSS formatting expands minified or compacted stylesheets into readable, indented rules with one property per line. Minifying reverses this, removing whitespace for smaller file sizes.
Development vs production
Use expanded CSS for development so diffs are readable and properties are easy to edit. Use minified CSS in production to reduce payload size.
Pre-processors
This tool formats plain CSS. For SCSS, LESS, or other pre-processors, compile to CSS first, then format the output.
How to use
- Paste your CSS into the input area.
- Click "Format" to expand and indent the stylesheet, or "Minify" to compress it.
- Copy the result with the "Copy" button.
Frequently Asked Questions
- What does CSS minification do?
- Minification removes comments, collapses whitespace, and strips spaces around special characters ({}:;,) to produce the smallest valid CSS. This reduces stylesheet file size and improves page load time.
- Does it support media queries and keyframes?
- Yes. @media, @keyframes, and other at-rules are formatted with the same indentation logic as regular rules.
- Is any CSS sent to a server?
- No. All formatting happens in your browser. Nothing is transmitted or stored.