CSS Prettify

Your data never leaves your browser

Format and beautify CSS code with consistent indentation and line breaks.

Brie — Bug Reporting Tool

Chasing a CSS bug across browsers?

Brie captures screenshots with device info and browser version automatically — no more "works on my machine."

Install Brie — It's FreeLearn more →

About CSS Prettify

Paste your minified or unformatted CSS and instantly get a cleanly formatted, human-readable version. The formatter adds newlines after opening braces, closing braces, and semicolons, and applies 2-space indentation to nested rules — all without any external dependencies.

How to use

  1. Paste your raw or minified CSS into the input panel.
  2. The formatted CSS appears instantly in the output panel on the right.
  3. Click Copy to copy the prettified CSS to your clipboard.

More CSS Tools

CSS Minify

Minify and compress CSS by removing comments, whitespace, and line breaks.

CSS to SCSS

Convert plain CSS to SCSS with nested selectors and $variables.

CSS Units Converter (px to rem)

Convert CSS pixel values to rem units for scalable, accessible designs.

Frequently Asked Questions

FAQs about CSS Prettify

What indentation does this use?

The formatter uses 2-space indentation for each nesting level, consistent with most modern CSS style guides.

Does it validate the CSS?

The formatter applies regex-based formatting and does not perform strict CSS validation. Use a dedicated CSS validator for that.

Are media queries handled?

Yes. Nested at-rules like @media, @keyframes, and @supports are indented correctly.

Is my data safe?

Yes. All formatting runs in your browser — no data is sent to any server.

What is the difference between prettify and minify?

Prettify adds whitespace, indentation, and line breaks to make CSS human-readable. Minify does the opposite — it removes all unnecessary whitespace for smaller file sizes.