FormatCodes
Home/CSS Tools/CSS Formatter

CSS Formatter

Format, minify, and validate CSS online for free, right in your browser.

Local browser processing
No sign-up required
Upload & download support
Language
CSSinput.css
Indent
Quick format
InputEditable
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
OutputCSS valid18 lines · 257 B
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
:root {
--main-color: #BA5A5A;
}
.btn {
/* primary button */
color: var(--main-color);
background: #ffffff;
padding: 8px 14px;
border-radius: 6px;
width: calc(100% - 20px);
}
@media (min-width: 600px) {
.btn {
padding: 10px 18px;
}
}
UTF-8 · Indent: 2 spaces · Auto wrap: onLocal processing · Ready
How It WorksCSS
Overview
This CSS formatter turns minified or inconsistently indented CSS into clean, readable code with consistent indentation, or minifies it down to the smallest size. It's built on a real CSS parser, so CSS variables, calc() expressions, url(), strings, and media queries are correctly recognized and never get broken. Everything runs locally in your browser; your data never leaves your device.
Use Cases
Clean up minified stylesheetsUnify a team's code indentation styleMinify CSS for production releaseCheck a stylesheet for syntax errors
Steps
123
Paste or uploadSet optionsGet the result

Related Tools

Related Guides

Frequently Asked Questions

Search Tools

Search 55+ formatting, conversion, minification, diffing, and generation tools