Minifieur CSS
Minifiez le CSS dans le navigateur.
À propos de cet outil
L’outil retire les commentaires et les espaces inutiles afin de réduire la taille du CSS envoyé au navigateur. Pratique pour une vérification rapide, la vraie minification restant le travail du bundler.
Comment l’utiliser
Collez un CSS lisible, lancez la minification, comparez le nombre d’octets avant et après, puis laissez votre chaîne de build produire l’artefact final.
Exemple
L’exemple contient un commentaire que la minification fait disparaître.
Entrée
.hero {
/* homepage band */
padding: 4rem 1.5rem;
background: #0f172a;
color: #e2e8f0;
}Sortie
.hero{padding:4rem 1.5rem;background:#0f172a;color:#e2e8f0}Conseil
Ne conservez jamais la seule version minifiée : gardez l’original formaté dans le dépôt.
Bon à savoir
De combien mon CSS sera-t-il allégé ?
Cela dépend de la quantité d'espaces et de commentaires : un CSS très commenté et indenté est celui qui diminue le plus. Cet outil retire seulement espaces et commentaires ; un minifieur de build peut aussi fusionner et raccourcir des règles, utilisez-le pour la version finale.
La minification peut-elle casser mes styles ?
Les espaces autour des sélecteurs descendants comme « nav :first-child » sont conservés, car les retirer changerait le sens. Les commentaires sont supprimés, bannières de licence comprises.