Minifizieren and beautify CSS
Komprimieren CSS for production (strip whitespace, comments, merge rules) and beautify minified CSS for debugging.
- 1
Minified CSS reduces file size and parse time in production. Beautified CSS is readable for development and debugging. The same source can be minified for deploy and beautified for inspection.
- 2 CSS-Formatierer →
Paste CSS. The tool can beautify (indent, one rule per line) or minify (strip whitespace, comments, unnecessary semicolons) depending on the mode.
- 3 HTML-Minifier →
If you are minifying an entire HTML document with inline <style> blocks, use the HTML minifier which handles CSS within style tags as part of the document.
- 4
Keep source maps when minifying for production — they map minified rules back to source for debugging. Preserve critical CSS (above-the-fold) separately from the deferred full stylesheet.
Häufige Fragen
- How much does minification save?
- Typically 15-30% of file size for well-written CSS, more for verbose stylesheets with many comments. The bigger win is often gzip/brotli compression on top of minification — enable both at the server level.
- Will minification change CSS behavior?
- Correct minification preserves all selectors, properties, and values — only whitespace, comments, and redundant syntax (trailing semicolons, zero units like 0px→0) are removed. Always diff the beautified minified output against the original to confirm equivalence.