piapia123
en

CSS Minifier & Beautifier

Web

Everything runs locally in your browser — nothing is uploaded

Input
Drop a file here to load its contents
Output

Collapse CSS to one line, or re-indent it into readable lines, and get the rule, declaration and selector counts plus the bytes before and after with the saving. It uses a small character-level scanner instead of deleting with regular expressions — the brace in `content: "}"`, the semicolon in `url("a;b.png")` and the comma in `[data-x="a,b"]` are all left alone. In minify mode the semicolon after the last declaration is dropped by default and can be kept; comments can go or stay (`/*!` licence comments are always kept). Everything runs in the browser.

Features

  • Three modes: minify, beautify, statistics only
  • Beautify with 2-space, 4-space or tab indentation
  • Counts of rules, declarations and selectors
  • Bytes before and after, plus the saving
  • Keep or drop the semicolon after the last declaration
  • Remove comments if you want; `/*!` licence comments are always kept
  • Braces, semicolons and commas inside strings, comments, url() and brackets are never touched
  • The difference between `a :hover` and `a:hover` is preserved
  • Copy the whole result, or copy a single statistic row

How to use

  1. Paste or drop CSS into the box
  2. Pick a mode, then adjust the indent, semicolon and comment options
  3. The output and the statistics update as you type
  4. Copy the processed CSS, or take individual numbers

FAQ

Why not just minify with regular expressions?
Because in CSS the characters `{};:,` are often data rather than structure: the brace in `content: "}"` is string content, the semicolon in `url(a;b.png)` belongs to the URL, and the comma in `[data-x="a,b"]` is inside a selector. A regular expression would cut through them and produce a stylesheet that looks fine but no longer means the same thing — and it usually still parses, so the mistake shows up only as wrong rendering. That is why the tool uses a small character-level scanner.
Does statistics-only mode skip computing the minified CSS?
It does compute it. The byte count and the saving are both measured on the minified result — it just does not display that CSS, so you can check how much you would save without a screen full of dense output.
Will removing comments delete the licence header?
No. A comment starting with `/*!` is the industry convention for a licence notice and is kept whether or not you tick remove comments.
Is the CSS uploaded?
No. Tokenising, minifying and counting all run in the browser, and the page makes no requests.

Related tools

CSS Formatter

Format

Format CSS online: one declaration per line, selectors split at commas. Minify only strips structural whitespace, keeping meaningful spaces in values.

CSS Units

Convert

Convert a CSS length between px, rem, em, vw, vh and more. Root font size and viewport are adjustable, and each row says what it assumed.

HTML Formatter

Format

Format HTML online by tag level, keeping text and inline tags on one line and script or pre content untouched. Runs locally, with nothing uploaded.

URL Parser

Web

Parse a URL into scheme, host, port, path, query parameters and fragment, with each parameter shown raw and decoded. Runs entirely in your browser.

User-Agent Parser

Web

Parse a user agent into browser, version, OS, device type and engine, and see which rules matched. Pattern matching only. Runs entirely in your browser.

HTTP Status Codes

Web

Look up an HTTP status code for its meaning, 1xx–5xx class, typical uses and common traps. Runs entirely in your browser.

← Back to all tools