Embellissez du CSS avec une indentation propre, ou minifiez-le pour réduire la taille du fichier. Gère les media queries, calc() et les commentaires de licence.
Comment utiliser l'outil Formateur CSS
Collez votre CSS dans la zone de saisie.
Choisissez Embellir pour le formater ou Minifier pour le compresser.
Choisissez la taille d'indentation, puis copiez le résultat.
Il s'agit d'un formateur CSS qui embellit les feuilles de style avec une indentation propre et cohérente, ou les réduit pour diminuer la taille du fichier. Vous choisissez la taille d'indentation pour l'embellissement, et passez à la réduction quand vous voulez la sortie la plus petite.
Un CSS lisible est plus facile à parcourir, à relire et à déboguer : quand chaque règle et chaque déclaration sont indentées de façon cohérente, vous voyez les sélecteurs, l'imbrication et la forme de vos media queries d'un coup d'œil.
La réduction est faite pour la production. Elle supprime les espaces et les commentaires dont les navigateurs n'ont pas besoin, afin que le fichier se télécharge plus vite. Sur une grande feuille de style, l'économie s'accumule, surtout avant la compression gzip sur le serveur.
Le réducteur est prudent là où cela compte. Il garde les espaces autour du plus et du moins à l'intérieur de calc(), donc calc(100% - 30px) reste valide, et il ne supprime les espaces qu'autour des caractères structurels comme les accolades, les deux-points et les points-virgules. Il gère aussi correctement les media queries imbriquées.
Les commentaires de licence écrits sous la forme /*! ... */ sont préservés, ce qui est la convention standard pour conserver les mentions de droit d'auteur et de licence dans une sortie réduite même lorsque les commentaires ordinaires sont supprimés.
L'embellissement et la réduction s'exécutent tous deux entièrement dans votre navigateur, donc vos feuilles de style ne quittent jamais votre appareil. L'outil formate pour la lisibilité et la taille ; il ne valide pas que votre CSS est correct.
Questions fréquentes
Non. Le minificateur conserve les espaces autour du plus et du moins dans les valeurs, de sorte que calc(100% - 30px) reste valide. Il ne supprime que les espaces autour des caractères structurels comme les accolades, les deux-points et les points-virgules.
Les commentaires normaux sont supprimés pour gagner de la place, mais les commentaires de licence écrits sous la forme /*! ... */ sont conservés, ce qui est la convention standard pour préserver les mentions de copyright.
Non. L'embellissement et la minification s'exécutent tous deux entièrement dans votre navigateur, de sorte que vos feuilles de style ne quittent jamais votre appareil.
Embellissez pendant que vous lisez, modifiez ou relisez du CSS. Minifiez la feuille de style finale pour la production, où un fichier plus petit se charge plus vite pour les visiteurs.
Non. Il formate et minifie le texte pour la lisibilité et la taille mais ne valide pas les propriétés ni les valeurs, il reformatera donc le CSS même s'il contient une erreur.
Intégrer cet outil
Ajoutez cet outil à votre propre site web. Copiez le code ci-dessous. Il reste à jour automatiquement.
<iframe src="https://monu.tools/embed/fr/css-formatter" width="100%" height="640" style="border:1px solid #e5e5e5;border-radius:12px;max-width:680px" loading="lazy" title="Monu Tools"></iframe>Outils similaires
Embellissez du HTML avec une indentation adaptée aux blocs, ou minifiez-le. Le contenu de pre, textarea, script et style est préservé.
Embellissez et reformatez du JavaScript avec une indentation et un espacement cohérents. S'exécute entièrement dans votre navigateur.
Convertissez du CSV en fichier Excel .xlsx et Excel en CSV, entièrement dans votre navigateur. Fonctionne dans les deux sens.
Générez des interfaces TypeScript à partir d'un exemple JSON, avec des types imbriqués, des tableaux et des champs optionnels. S'exécute dans votre navigateur.