CSS Minify

What is CSS Minify?

Paste CSS and get it minified instantly: comments and whitespace stripped, output shrunk for production without changing what the styles do. Smaller CSS means a faster first paint, especially on a mobile connection where every kilobyte in the critical render path costs load time. Minification here runs entirely in your browser, so you can shrink a stylesheet before committing it without sending your source to a third-party service.

How to Use CSS Minify

1. 1

   Paste the CSS: Enter any CSS, including comments and indentation.

2. 2

   Read the Minified Result Instantly: The minified output appears automatically as you type.

3. 3

   Copy the Result: Use the copy button to copy the minified CSS for production.

How It Works

Every CSS comment (`/* ... */`) is removed, and all formatting whitespace (indentation, blank lines, line breaks between rules) is collapsed. Redundant trailing semicolons before a closing brace are dropped. Selectors, property names, and values themselves are left untouched, so the visual result of the stylesheet is unchanged, only its byte size shrinks.

Example

.card {
  /* card container */
  padding: 16px;
  border-radius: 8px;
  background: #ffffff;
}

.card{padding:16px;border-radius:8px;background:#ffffff}

The comment and all formatting whitespace are gone; every selector, property, and value is untouched.

Common Use Cases

• Shrinking a hand-written stylesheet before deploying it to production, cutting the number of bytes the browser has to download before it can paint the page.

• Preparing a small CSS snippet to inline in an email template or a `<style>` block, where every character counts toward a size limit.