Can minifying break my styles?

Not with these transformations, all are rendering-neutral. Tools that merge rules or reorder declarations carry more risk.

Is it worth minifying if my server gzips?

Somewhat. Comment removal and colour shortening reduce content that gzip cannot eliminate, though the whitespace saving largely overlaps with compression.

Formatters

CSS Minifier

Compress CSS with safe, conservative optimisations.

LiveCtrl+↵

Inputcss0 lines · 0 chars

Outputcss0 lines · 0 chars

Options

Shorten hex colours

About this tool

Minifying CSS removes everything a browser does not need: whitespace, comments, the final semicolon in each block, and redundant leading zeros. A few safe value optimisations are applied on top, such as shortening six-digit hex colours that can be written in three.

Every transformation here is one that cannot change rendering. More aggressive tools merge rules and reorder declarations, which is where minification occasionally breaks a stylesheet.

How to use it

Paste or upload your cssDrop a file onto the input pane, use the file picker, or paste the text directly.
Adjust the options if neededThe defaults suit most input; open Options to change the behaviour.
MinifyPress Minify, or use Ctrl+Enter (Cmd+Enter on macOS).
Copy or downloadCopy the result, or download it as a .css file.

Worked examples

Each example below is executed against this tool by the test suite, so what you see is what the tool actually produces.

Whitespace, comments and colour shortened

Input

/* card styles */
.card {
  color : #aabbcc ;
  margin : 0.5em ;
}

Output

.card{color:#abc;margin:.5em}

The comment and whitespace are gone, the hex shortened, and the leading zero dropped.

What to watch for

The details that decide whether a conversion is correct, and where information can be lost without any error being raised.

What is removed: Comments, whitespace around braces, colons and semicolons, and the semicolon before a closing brace. Leading zeros are dropped, so 0.5em becomes .5em, valid and slightly shorter.
Hex colour shortening: A six-digit hex value whose pairs repeat can be written in three digits: #aabbcc becomes #abc, which is the identical colour. Values without repeating pairs are left as they are.
Strings and url() are protected: Whitespace inside a quoted string or a url() is content and is preserved. Collapsing it would change a content value or break a path containing spaces.
Why rules are not merged: Combining rules with identical declarations, or reordering properties, can change specificity and cascade outcomes in ways that are hard to predict. Those optimisations are deliberately not applied, so minified output is guaranteed to behave the same as the input.

Limitations

Does not merge duplicate rules or reorder declarations, which limits the saving but guarantees identical behaviour.
Does not add vendor prefixes or remove unused rules.
Processing happens in your browser, so very large inputs are bounded by available memory. Files above roughly 10 MB are handled but will feel slower, and multi-hundred-megabyte files are better suited to a command-line tool.

Questions

Can minifying break my styles?: Not with these transformations, all are rendering-neutral. Tools that merge rules or reorder declarations carry more risk.
Is it worth minifying if my server gzips?: Somewhat. Comment removal and colour shortening reduce content that gzip cannot eliminate, though the whitespace saving largely overlaps with compression.