CSS Minifier

Incolla un foglio di stile per eliminare spazi e commenti, accorciare valori come #ff0000 → red e unire le regole duplicate con le ottimizzazioni strutturali di CSSO.

Funziona nel browserNessuna registrazioneNessun caricamento

Output minificato

Come usare CSS Minifier

  1. Incolla il CSS o apri un file .css.
  2. Lascia attivo Ristruttura per unire regole e dichiarazioni, oppure disattivalo per un passaggio sicuro che tocca solo gli spazi.
  3. Lascia attivo Mantieni i commenti di licenza per conservare gli avvisi /*! … */.
  4. Confronta le dimensioni originale, minificata e compressa con gzip.
  5. Copia il risultato o scarica output.min.css.

Come funziona la minificazione CSS

Questo strumento usa CSSO (CSS Optimizer), che analizza il foglio di stile in un albero sintattico e lo riscrive nella forma equivalente più corta. Oltre a rimuovere spazi e commenti applica riscritture sicure dei valori:

  • #ffffff → #fff, #ff0000 → red
  • 0px → 0, 0.90 → .9
  • margin: 8px 16px 8px 16px → margin:8px 16px
  • Le regole vuote e le dichiarazioni duplicate vengono eliminate

Cosa fa “ristruttura”?

La ristrutturazione analizza l'intero foglio di stile: le regole con dichiarazioni identiche vengono unite in un unico elenco di selettori (.a,.b{color:red}) e i selettori ripetuti vengono combinati. Sui fogli di stile reali questo fa risparmiare spesso un altro 5–15%. CSSO unisce solo quando l'ordine della cascata resta invariato, ma se ti affidi a override insoliti puoi disattivarla per una minificazione puramente sintattica.

Perché minificare il CSS?

Il CSS blocca il rendering: il browser non può disegnare la pagina finché i fogli di stile nell'<head> non sono stati scaricati e analizzati. Un CSS più leggero significa un First Contentful Paint più rapido e Core Web Vitals migliori, a vantaggio sia degli utenti sia del posizionamento nei motori di ricerca. Per il miglior risultato combina la minificazione con gzip o Brotli sul server.

Domande frequenti

Minificare il CSS è sicuro?
Sì. Spazi e commenti non influiscono sul rendering del CSS e le riscritture dei valori di CSSO sono equivalenti per specifica. La ristrutturazione mantiene l'ordine della cascata; disattivala se vuoi l'output più conservativo.
Supporta il CSS moderno, come custom property, nesting e @layer?
Sì. Custom property (--var), @media, @supports, @layer, @container e la sintassi grid vengono mantenuti.
Posso de-minificare il CSS in seguito?
Il CSS minificato può essere reindentato da qualsiasi formatter, ma i commenti rimossi non si possono recuperare. Conserva il file sorgente originale e tratta il file minificato come un output di build.
Il mio foglio di stile viene caricato da qualche parte?
No. La minificazione avviene nel tuo browser; nulla viene inviato a un server.

Strumenti correlati

JavaScript Minifier Comprimi e offusca JS con Terser, con statistiche di dimensione e gzip. HTML Minifier Rimuovi commenti e spazi e minifica CSS/JS inline. SQL Formatter Formatta o minifica SQL per PostgreSQL, MySQL, T-SQL, BigQuery e altri. JSON Formatter Formatta, minifica e valida JSON con errori per riga/colonna.