Developer Tools

CSS Minifier

Minify CSS by removing comments, collapsing whitespace, compacting selectors and declarations, and showing exact character savings.

View all Developer Tools

Add CSS to see size savings.

Continue Workflow

Related tools to try next

All tools

HTML Minifier

Minify HTML snippets by removing comments, collapsing whitespace, and compacting markup.

HTML Formatter

Format, indent, and minify HTML snippets for cleaner markup and code review.

CSS Unit Converter

Convert between CSS units: px, em, rem, vw, vh, and percentage. With live preview.

Browser Local No sign-up

Example

Minify component CSS

The minifier removes layout whitespace and unnecessary semicolons before closing braces.

Input


                        .card {\n  color: #111827;\n  padding: 1rem;\n}\n.card:hover {\n  color: #2563eb;\n}

Output


                        .card{color:#111827;padding:1rem}.card:hover{color:#2563eb}

Preserve a license comment

Keep license comments enabled when a stylesheet requires attribution in the distributed file.

Input


                        /*! normalize.css license */\n.button {\n  display: inline-flex;\n}

Output


                        /*! normalize.css license */.button{display:inline-flex}

Compact responsive CSS

Media queries and function values can usually be compacted safely, but the result should still be tested in the browser.

Input


                        @media (min-width: 768px) {\n  .grid {\n    grid-template-columns: repeat(2, 1fr);\n  }\n}

Output


                        @media(min-width:768px){.grid{grid-template-columns:repeat(2,1fr)}}

Practical Notes

How to Use

  1. 1. Paste CSS into the input area.
  2. 2. Choose whether to remove comments and keep license comments.
  3. 3. Click Minify CSS to create compact output.
  4. 4. Use Beautify when you need a readable version for review.
  5. 5. Copy the output when the CSS is ready.

Features

Use Cases

Frequently Asked Questions

What does the CSS Minifier remove?
It removes regular comments, collapses whitespace, removes unnecessary spaces around punctuation, and drops trailing semicolons before closing braces.
Can CSS minification break styles?
Basic whitespace minification is usually safe, but always test the result. Complex generated CSS, unusual hacks, or template placeholders may need special handling.
Does this tool handle source maps?
No. This browser tool is intended for quick snippets and manual cleanup. Use your build pipeline when you need source maps or advanced CSS processing.
Is my CSS uploaded?
No. The CSS is processed locally in your browser and is not uploaded to a server.
Should I replace my source CSS with minified CSS?
Usually no. Keep readable source CSS in your project, then use minified CSS for distribution, embedding, or quick publishing workflows.
Can I minify CSS variables and media queries?
Yes for normal CSS syntax. The tool keeps quoted strings and compact punctuation around custom properties, functions, and media queries, but you should still test the result.