Format a stylesheet into one selector per line, or minify it by taking out the whitespace and comments a browser ignores. Both are text rewrites in this page: nothing is uploaded, and strings, url() payloads and custom properties come back unchanged.
Runs locally in your browserPaste a stylesheet and press Format to get one selector per line with tab indentation, or Minify to strip the whitespace and comments a browser ignores anyway. Both are plain text rewrites inside this page: the CSS is never uploaded, and there is no build step, no engine to install and no account.
The rewrite is deliberately conservative. Values are carried over as written — strings, url() payloads such as data: URIs, attribute selectors, escape sequences and custom properties are never reflowed — and nothing is added: no missing semicolons, no vendor prefixes, no merged rules. What comes back is your own stylesheet with different layout.
Format writes one selector per line, indents each nesting level with a tab, and puts every declaration on its own line inside selector { … }. Selector lists keep their commas, at-rules such as @media and @supports keep their blocks, and an empty rule stays empty. A declaration that was typed without a semicolon still has none afterwards, and runs of semicolons are collapsed into one.
This is a whitespace pass, not a style pass. Long lines are not wrapped at a column, declarations and rules are not reordered, duplicate declarations and shorthands are not merged, and vendor prefixes are not added. A stylesheet indented with eight spaces and one wrapped by hand come out with the same tab indentation.
Minify collapses a run of whitespace into a single space where CSS needs one and removes it where it does not. So .a > .b becomes .a>.b and red !important becomes red!important, while calc(100% - 20px), 1px solid #000 and the value list in rgba(0, 0, 0, .5) keep the spaces and commas that carry meaning. Tabs and line breaks disappear everywhere except inside strings and url() payloads.
The saving comes from whitespace, comments and repeated semicolons only. A file that is already minified barely moves: the 121 KB Bootstrap 3.3.7 stylesheet loses 333 bytes here, because there is nothing left to take out. A hand-indented file with comment banners gains a few percent more. Class renaming, rule merging and unused-selector removal are not part of this tool.
Delete Comment is off by default. When it is on, /* … */ blocks are removed before the rest of the work — including /*! … */ licence banners, which is the one case where Minify changes a file that a licence expects to be preserved. Attribute lowercase is on by default and lowercases property names only: COLOR:RED becomes color:RED. Values keep their case, so url(X.PNG) is untouched, and at-rule names are left alone as well.
Custom properties are exempt from the lowercasing on purpose. --MainColor and var(--MainColor) name the same variable only while the spelling matches, so rewriting the definition into --maincolor would break every reference. Horizontal Arrange joins the formatted output so that each rule occupies a single line with a break after its closing brace; Minify ignores the setting.
There is no CSS parser behind the two buttons, so nothing is validated or repaired. A missing closing brace is passed through as typed, an extra brace is kept, and text that is not CSS at all — HTML, JavaScript, prose — is copied back unchanged. A stylesheet that a browser already accepts will be accepted here; a broken one comes back broken, with the breakage in the same place.
Nothing is uploaded: the whole tool is a script that arrives with the page, so there is no request while you work and it keeps working with the network disconnected. Size is the practical limit. A 1.2 MB stylesheet is rewritten in about 130 ms, but colouring the result for the screen takes about 1.7 s, and that is what you wait for.