Formateur & Embellisseur CSS

Collez du CSS brut ou minifié, puis embellissez-le avec une indentation correcte ou minifiez-le pour la production. Prend en charge toutes les syntaxes CSS modernes, y compris les media queries et les variables.

Entrée

Sortie

Fonctionnalités

Basculer entre embellir et minifier

Trier les propriétés

Supprimer les doublons

Comment Utiliser

1. Collez votre CSS dans la zone de saisie à gauche.

2. Cliquez sur Formater pour embellir, ou Minifier pour compresser.

3. Copiez le résultat formaté depuis le panneau de droite.

À propos de cet outil

Un CSS minifié ou retouché à la main est difficile à relire : une seule longue ligne cache les règles en double, les points-virgules manquants et les surcharges. Ce formateur reconstruit la feuille de style avec une déclaration par ligne et une indentation cohérente de deux espaces, quatre espaces ou tabulations, en préservant les chaînes, les commentaires et les blocs imbriqués comme @media et @supports. La minification fait l'inverse pour la production : elle supprime les commentaires et les espaces inutiles pour réduire la taille transférée. Vous pouvez coller du code ou déposer un fichier .css, puis copier ou télécharger le résultat. Le formatage ne change que la présentation — l'ordre et le sens de vos règles restent exactement les mêmes, la cascade se comporte donc comme avant.

Questions Fréquentes

Le formatage va-t-il changer le comportement de mon CSS ?

Non. Le formateur ne modifie que les espaces et les sauts de ligne. Les sélecteurs, les déclarations et leur ordre sont conservés : la spécificité et la cascade fonctionnent donc exactement comme avant.

Combien la minification du CSS fait-elle gagner ?

Supprimer les commentaires et les espaces réduit généralement une feuille de style écrite à la main de 15 à 30 %. La servir avec une compression gzip ou Brotli fait gagner bien davantage : utilisez les deux en production.

Prend-il en charge @media, @supports et les règles imbriquées ?

Oui. Les règles @ et les blocs imbriqués sont indentés par niveau, et leur contenu est formaté comme n'importe quelle autre règle : les media queries restent faciles à parcourir.

Les commentaires sont-ils conservés ?

Le formatage conserve les commentaires de bloc et les place sur leur propre ligne. La minification les supprime, puisque le navigateur n'en a pas besoin.

Le formateur vérifie-t-il les erreurs de mon CSS ?

Il ne valide ni les noms ni les valeurs de propriétés. Il formate ce qu'il reçoit : une faute de frappe comme colr: red reste donc dans le résultat. Utilisez votre éditeur ou un linter comme Stylelint pour repérer les erreurs.