Formateur CSS
Formatez et embellissez le CSS avec une indentation cohérente.
À propos de cet outil
Formate et embellit le CSS : les règles compressées ou négligées passent à une déclaration par ligne avec un espacement cohérent, pour faciliter relectures et diffs. Seuls les espaces changent ; sélecteurs, valeurs et cascade restent identiques.
Comment l’utiliser
Collez du CSS minifié ou tenu sur une seule ligne, lancez le formatage, puis recopiez le résultat dans votre éditeur. Le minifieur fait le trajet inverse quand vous préparez la production.
Exemple
L’exemple part d’une carte minifiée dont l’indentation est restaurée.
Entrée
.card{display:flex;padding:1.5rem;border-radius:.5rem;background:#fff}.card h2{font-size:1.25rem;font-weight:600;margin:0 0 .5rem}Sortie
.card {
display: flex;
padding: 1.5rem;
border-radius: .5rem;
background: #fff;
}
.card h2 {
font-size: 1.25rem;
font-weight: 600;
margin: 0 0 .5rem;
}Conseil
Formatez avant la revue de code, minifiez seulement pour les bundles de production.
Bon à savoir
Un embellisseur CSS est-il différent d'un formateur CSS ?
Non. C'est la même opération — réindenter les règles et mettre une déclaration par ligne — donc cette page couvre les deux.
Le formatage change-t-il le comportement de mon CSS ?
Non. Seuls les espaces et les retours à la ligne changent, la cascade reste donc identique. Les chaînes et les valeurs url(data:…) sont protégées : un point-virgule à l'intérieur ne coupe jamais une déclaration.