CSS Formatter

Paste raw or minified CSS — get clean, indented output. Or compress for production.

  • Runs in browser
  • No signup
  • No tracking
Share

How to use CSS Formatter

  1. Paste CSS into the input pane (or upload a .css file).

  2. Pick indent style.

  3. Click Format or Minify.

  4. Copy or download the result.

When to use it

  • Inspecting minified CSS from a production bundle.

  • Cleaning up exported styles from a design tool.

  • Preparing CSS for code review.

  • Shipping minified CSS to production.

What it fixes

  • Online formatters that mangle vendor prefixes.

  • Tools that strip your !important flags or rewrite shorthand.

  • Minifiers that break CSS variable references.

About CSS Formatter

CSS formatting normalizes indentation, declaration spacing, and brace placement. The minifier removes comments and collapses whitespace where the parser doesn't care.

This tool runs js-beautify locally. Multi-thousand-line stylesheets format instantly, and your code never leaves the page.

References: MDN — CSS reference · W3C CSS Snapshot 2024

Frequently asked

  • Is my CSS sent to a server?

    No. js-beautify runs in your browser. Nothing leaves your device.

  • Does it preserve at-rules and nested selectors?

    Yes. Media queries, keyframes, and nested selectors are formatted with proper indentation.

  • What about minification?

    Strips comments, collapses whitespace, removes redundant semicolons. Lossless transformations only.

  • Can it handle SCSS or Less?

    It handles plain CSS reliably. SCSS-specific syntax (variables, mixins) may not format ideally.

Discussion

All tools