CSS Minifier
Paste your CSS and get a minified version instantly, using csso to remove whitespace and comments and safely optimize rules. All processing happens in your browser, without uploading your code to any server.
How it works
- Paste or type your CSS into the input panel (a preloaded example lets you try the tool right away).
- Click 'Minify CSS' to process it.
- The tool uses csso, a library specialized in optimizing CSS without changing its visual behavior, to generate the result.
- The original size, minified size, and percentage reduction are shown as indicators next to the button.
- Copy the minified CSS with the copy button to use it wherever you need.
Use cases
- Reduce the weight of stylesheets before deploying them to production without setting up a full build process.
- Compare how much a CSS file weighs before and after optimizing it.
- Clean up CSS generated by automated tools, design exporters, or preprocessors.
- Prepare compact CSS to embed directly in a <style> tag.
Use cases
- Reduce the weight of stylesheets before deploying them to production without setting up a full build process.
- Compare how much a CSS file weighs before and after optimizing it.
- Clean up CSS generated by automated tools, design exporters, or preprocessors.
- Prepare compact CSS to embed directly in a <style> tag.
Common mistakes
- Expecting minification to change CSS's visual behavior.csso only optimizes syntax (whitespace, comments, and some safe rule merges); the result should look exactly the same. If you notice visual differences, check for duplicate selectors or rules with conflicting specificity in the original CSS.
- Minifying CSS with unclosed braces or parentheses expecting the tool to fix it automatically.Malformed CSS can produce an unexpected result or an error message. Check that every rule has its closing brace before minifying.
- Losing important comments, like license notices, when minifying.Minification removes all comments by default to reduce file size. If you need to keep a specific comment, add it back manually to the final file after minifying.
Frequently asked questions
It uses csso, an open-source library specialized in safely optimizing CSS, merging rules and removing whitespace and comments without altering the visual result.
No. All processing happens locally in your browser using JavaScript. Your CSS never leaves your device.
The tool catches the error during processing and shows a message explaining the problem, instead of returning an incorrect result.
It depends on the original CSS: files with heavy indentation, comments, or repeated rules tend to shrink more. The tool shows the exact reduction percentage after each minification.
Alternatives
Build tools like Vite, webpack, or Parcel minify CSS automatically as part of the production process, using plugins like cssnano or csso itself. This tool is useful for minifying a one-off snippet without setting up a full project, for example before pasting CSS into an email, a CMS, or a template.