Aller au contenu
uencoder

Minifier and beautify CSS

Compresser CSS for production (strip whitespace, comments, merge rules) and beautify minified CSS for debugging.

  1. 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. 2
    Formateur CSS →

    Paste CSS. The tool can beautify (indent, one rule per line) or minify (strip whitespace, comments, unnecessary semicolons) depending on the mode.

  3. 3
    Minificateur HTML →

    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. 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.

Questions fréquentes

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.

Workflows résolvant cette tâche

Outils associés