PXLTools

CSS Minifier

Minify or beautify CSS code

How to use CSS Minifier

  1. Paste your CSS into the input panel.
  2. Choose Minify to strip whitespace and comments, or Beautify to add consistent formatting.
  3. In Beautify mode, select your indentation style (2 spaces, 4 spaces, or tabs).
  4. The stats bar shows the size reduction for minification.
  5. Copy or download the processed CSS.

What is CSS minification?

CSS minification is the process of removing unnecessary characters from CSS — whitespace, comments, and redundant semicolons — to reduce file size while preserving functionality. Smaller CSS files load faster, which improves page performance and user experience.

Beautification (also called prettification) is the opposite: it adds whitespace, line breaks, and indentation to make CSS easy to read and edit. Developers typically work with beautified CSS during development and serve minified CSS in production.

Most modern build tools (webpack, Vite, esbuild, PostCSS with cssnano) handle minification automatically. This tool is useful for quick one-off minification or beautification of CSS snippets you find online, export from a service, or paste from a colleague.

Frequently Asked Questions

How much can CSS minification save?
Typical CSS files compress by 15-30% after minification. For production websites, combine minification with gzip or brotli compression at the server level for even greater savings.
Will minification break my CSS?
Properly-written CSS will not break. However, if your CSS relies on specific whitespace in string values or uses unusual formatting in comments, double-check the output. Common issues are extremely rare.
What about preprocessors like Sass or LESS?
This tool works on standard CSS output. Compile your Sass/LESS first, then minify the resulting CSS. Most preprocessor toolchains (webpack, Vite, etc.) already include minification in production builds.
Does it preserve source maps?
No. This is a simple text-level minifier. If you need source maps, use a build tool like cssnano or esbuild as part of your development workflow.