Qu'est-ce que Minificateur CSS ?

CSS Minifier compresse votre CSS en supprimant les espaces, les commentaires et la syntaxe redondante. Des fichiers plus légers se téléchargent plus vite et font grimper votre score PageSpeed.

En interne, l'outil exécute l'algorithme CSSO, qui fait plus que supprimer les espaces. Il fusionne les règles adjacentes au même sélecteur, supprime les redondances en notation courte (margin: 10px 10px 10px 10px devient margin: 10px), enlève les préfixes vendeur devenus inutiles et raccourcit les couleurs hex de six à trois caractères quand c'est possible.

Comment utiliser

1. Collez votre code CSS dans la zone de saisie, importez un fichier .css ou chargez une feuille de style directement depuis une URL.
2. Cliquez sur minifier pour compresser — l'outil supprime les commentaires, les espaces et raccourcit les valeurs.
3. Copiez le résultat minifié ou téléchargez-le en fichier .css. Vérifiez le taux de compression affiché.

Quand l'utiliser

• Publier la feuille de styles d'un site statique qui n'a pas d'étape de build.
• Comparer deux versions d'un CSS pour mesurer combien de répétitions s'y cachent.
• Gagner les derniers octets quand on inline du CSS critique dans le head HTML.

Résultat

Une feuille de styles de 24 Ko avec commentaires et mise en forme est réduite à 16 Ko — soit 33 % de réduction, ce qui économise 50 ms de chargement sur une connexion 3G.

FAQ

Le CSS minifié se rend-il différemment de l'original ?

Les navigateurs parsent du CSS minifié et du CSS formaté de manière identique. La cascade, la spécificité et les styles calculés sont les mêmes. Seule la taille du fichier sur disque et sur le réseau change.

Faut-il aussi appliquer gzip ?

Oui. Gzip après minification fait gagner encore 60 à 80 %. La plupart des CDN appliquent gzip automatiquement. Minifier d'abord reste utile car gzip compresse les motifs répétés, et le CSS minifié en contient davantage.

La minification casse-t-elle mes source maps ?

Cet outil ne génère pas de source map, il travaille sur une seule chaîne CSS, pas sur un graphe de build. Si vous avez besoin des maps, utilisez un bundler comme esbuild ou Vite qui produit le .css.map à côté du CSS minifié.

Pourquoi mon fichier minifié contient-il encore des espaces ?

CSS garde les espaces dans les valeurs textuelles, entre les parties d'un sélecteur (.a .b ne vaut pas .a.b) et dans calc(). Le minifieur retire seulement les espaces sans sens sémantique et laisse les autres.

Peut-on minifier en toute sécurité du CSS avec des custom properties ?

Oui. Les noms et valeurs des propriétés personnalisées restent intacts. Le minifieur n'agit que sur la mise en forme autour. Des variables comme --brand-color survivent telles quelles et continuent d'être lues par var().

Outils similaires