TL
Tool Lab
💰Donate
💰Donate

CSS Formatter

Format, beautify, and minify CSS

Input
Output

About This Tool

The CSS Formatter & Beautifier converts compressed or unreadable CSS into clean, properly indented stylesheets. It handles all standard CSS features including media queries, pseudo-classes, keyframe animations, custom properties (--variables), and nested selectors.

The minify mode removes all comments and unnecessary whitespace, producing the smallest possible valid CSS for production. All processing happens locally in your browser — no CSS is ever sent to a server.

How to Use

  1. Paste your CSS into the Input panel on the left.
  2. Select your preferred indentation (2 or 4 spaces).
  3. Click Format to beautify, or Minify to compress.
  4. Click Copy to copy the result to your clipboard.

Use Cases

Front-end developers format CSS copied from browser DevTools, legacy stylesheets, or design system exports. The minify feature reduces CSS bundle size in production, often cutting file size by 30–50%. Also useful for formatting CSS-in-JS output and third-party libraries for inspection.

FAQ

  • Does it support SCSS/LESS?This tool formats standard CSS only. For SCSS or LESS, use a dedicated preprocessor formatter.
  • Are comments preserved?During formatting, comments are preserved. The minify mode removes all comments to reduce file size.
  • Is my data safe?All processing is local in your browser. No CSS is ever transmitted to any server.