Unminify CSS Online — Free CSS Formatter

Unminify minified CSS instantly with our free online tool. Restore readable formatting from compressed stylesheets. All processing in your browser.

Loading…
CSS Unminification
Unminify compressed CSS online. Restore readable formatting for debugging production styles.

Features

Restore the readability of your minified CSS code by adding spaces and line breaks.

Unminify

Restore the readability of your minified CSS code by adding spaces and line breaks.

Package used

CSSO
v5.0.5

CSSO (CSS Optimizer) is a powerful tool for optimizing CSS files by removing redundancies and compressing code.

Basic example

Minified CSS

.container{margin:20px;padding:10px;background-color:#fff}.button{color:#000;font-size:16px;border:1px solid #ccc}.card{display:flex;flex-direction:column;gap:12px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.12)}

Formatted CSS

.container { margin:20px; padding:10px; background-color:#fff; } .button { color:#000; font-size:16px; border:1px solid #ccc; } .card { display:flex; flex-direction:column; gap:12px; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,.12); }

Minification options

Beautify Options
Indentation options for Beautify and Unminify (not used by Minify)

Indentation Size

Sets the number of spaces or tabs for indentation during Beautify and Unminify

Original code
.header{color:red;padding:10px}
With 2 spaces
.header { color: red; padding: 10px; }
With 4 spaces
.header { color: red; padding: 10px; }
Difference
Beautify and Unminify both use the indentation controls in the toolbar. Minify ignores them.

Indentation Type

Use spaces or tabs for indentation during Beautify and Unminify

Original code
.header{color:red;padding:10px}
With spaces
.header { color: red; padding: 10px; }
With tabs
.header { color: red; padding: 10px; }
Difference
Spaces are more standard, tabs may be preferred according to your code conventions.

How to Unminify CSS Online

CSS unminification restores readable formatting to compressed stylesheets. Paste any minified CSS into our tool to add proper indentation, line breaks, and organize selectors. This is essential for debugging production stylesheets, reviewing third-party CSS frameworks, or understanding vendor styles.

CSS Beautifier — Formatting Your Stylesheets

Our CSS beautifier applies consistent formatting rules to your stylesheets — standardized indentation, property ordering, and clean selector formatting. Whether your CSS comes from a build process, a minifier, or another developer, beautification makes it clean and maintainable.

Concatenating CSS Files

Combine multiple CSS files into a single stylesheet to reduce HTTP requests and simplify deployment. Use our concatenation feature to merge files, then optionally minify the combined output. This is especially useful for projects without a CSS preprocessor or bundler.

Frequently Asked Questions — Unminify

Everything about unminification

How do I unminify CSS?

Paste minified CSS and click Unminify. Indentation and line breaks are restored for debugging.

Need beautify instead of unminify?

For already-readable CSS, use the CSS beautifier.

Looking for converters, encoders, formatters, and minifiers in one place? Developer tools hub Open the curated developer tools catalogue.

Other actions for this language