Minifier et formater du CSS

Collez votre feuille de style et cliquez sur « Minifier » pour supprimer les commentaires, espaces et retours à la ligne inutiles, ou sur « Formater » pour transformer un CSS compressé en code lisible et bien indenté. Tout se passe dans votre navigateur.

CSS


Que fait le minificateur ?

Il supprime tout ce dont le navigateur n'a pas besoin : commentaires, indentation, retours à la ligne, espaces autour des accolades, deux-points, virgules et combinateurs, et le dernier point-virgule de chaque bloc. Le résultat pèse généralement de 15 à 30 % de moins et fonctionne exactement de la même façon.

Nous respectons ce qui ne doit pas être modifié : le contenu des chaînes (content: "…"), les chemins des url(), les espaces obligatoires de calc() et des media queries, et les commentaires commençant par /*!, qui par convention contiennent des licences et doivent être conservés.

Minifier en production

Moins d'octets, c'est un téléchargement plus rapide et de meilleurs Core Web Vitals, surtout sur mobile. En plus de minifier, activez la compression gzip ou Brotli sur le serveur, qui réduit bien davantage le CSS, et servez les fichiers avec un cache de longue durée.

Dans un projet avec une étape de build (Vite, webpack, PostCSS…), la minification se fait automatiquement avec cssnano ou Lightning CSS ; cet outil est pratique pour les sites simples, les templates ou pour lire (formater) le CSS minifié d'un autre site.