Vai al contenuto
SPCXTools

Minificatore CSS

Comprimi i tuoi fogli di stile — rimuovendo spazi vuoti, commenti e regole ridondanti — e scopri quanto spazio hai risparmiato.

Funziona localmente: i file non lasciano mai il tuo dispositivo

Caricamento strumento…

Come usare Minificatore CSS

  1. 1Incolla il tuo CSS nel riquadro di Input, oppure clicca su Esempio.
  2. 2Il CSS minificato appare automaticamente sulla destra.
  3. 3Lascia spuntata l'opzione Mantieni i commenti di licenza per conservare i commenti /*! … */ richiesti da molte licenze.
  4. 4Copia il risultato o scaricalo come minified.css.

Riduci le dimensioni del tuo CSS

Ogni byte di CSS deve essere scaricato e analizzato prima che una pagina possa essere renderizzata, quindi fogli di stile più leggeri significano un first paint più rapido, Core Web Vitals migliori e un minor consumo di dati mobili. Questo minificatore CSS rimuove spazi vuoti e commenti e applica ottimizzazioni strutturali — unendo regole duplicate, accorciando i colori, rimuovendo valori ridondanti — in modo che il tuo foglio di stile diventi il più piccolo possibile senza alterare l'aspetto della pagina.

Funzionalità

  • Rimozione di spazi vuoti e commenti.
  • Abbreviazione dei valori: colori, zeri, unità di misura e spessore dei font.
  • Ottimizzazione strutturale: unisce i selettori duplicati e rimuove le dichiarazioni sovrascritte.
  • Commenti di licenza (/*! … */) mantenuti su richiesta.
  • Confronto delle dimensioni in byte e in percentuale.
  • Privato: viene eseguito interamente nel tuo browser.

Prima e dopo

.card .title {
  font-weight: bold;
  color: #333333;
}
.card .title {
  font-size: 1.25em;
}

diventa

.card .title{font-weight:700;color:#333;font-size:1.25em}

Quando minificare

Minifica il CSS come parte della tua build per la produzione e mantieni il codice sorgente leggibile nel controllo di versione. La maggior parte dei framework e dei bundler lo fa automaticamente; questo strumento è comodo per correzioni rapide, temi per CMS, template di email, widget incorporati e progetti senza una fase di build.

Strumenti correlati

Minifica gli script con il Minificatore JavaScript, crea stili visivamente con il Generatore di Box Shadow e il Generatore di Gradienti CSS, oppure formatta il JSON con il Formattatore JSON.

Domande frequenti

Cosa fa un minificatore CSS?
Rimuove tutto ciò di cui i browser non hanno bisogno — spazi vuoti, ritorni a capo e commenti — e riscrive i valori nella loro forma più breve, come #ffffff → #fff e 0px → 0. Questo minificatore (CSSO) unisce anche selettori e dichiarazioni duplicati e rimuove le proprietà sovrascritte.
Il CSS minificato è sicuro da usare?
Sì. Le ottimizzazioni strutturali sono progettate per mantenere lo stesso risultato visivo. Come per ogni fase di build, testa le tue pagine dopo il deploy, specialmente se usi hack insoliti o CSS non valido.
Di quanto si ridurrà il mio CSS?
Solitamente del 15–40% prima della compressione. I fogli di stile scritti a mano e ben commentati si riducono maggiormente. La compressione gzip o Brotli del tuo server ridurrà ulteriormente le dimensioni di trasferimento.
Perché mantenere i commenti di licenza?
Molte licenze open-source richiedono che la nota di copyright rimanga nel codice. I commenti che iniziano con /*! sono la convenzione per i commenti che i minificatori dovrebbero mantenere.
Il mio codice viene caricato online?
No. La minificazione avviene nel tuo browser; il codice non lascia mai il tuo dispositivo.