Formater ou minifier du CSS
CSS Beautifier & Minifier
Met en forme ou minifie du CSS sans rien réordonner, en conservant le flux de jetons à l’identique.
Met en forme une feuille de style pour que vous puissiez la lire, ou la dégraisse quand vous la voulez plus petite. Les deux sens sont vérifiés contre le flux de jetons à chaque passage : la sortie est votre feuille de style avec des espaces différents et rien d'autre — pas de fusion de propriétés raccourcies, pas de couleurs abrégées, pas de règles réordonnées.
CSS en entrée
Déposez un fichier .css
Lu dans cet onglet. Rien n’est envoyé.
Formaté
Règles
5
Sélecteurs
9
Déclarations
9
Règles at
1
Propriétés personnalisées
2
Comment s’en servir
Collez le CSS ou déposez un fichier
Les at-rules imbriquées, les propriétés personnalisées, `:is()` et les sélecteurs modernes s'analysent tous. La barre de statistiques sous les panneaux compte les règles, les sélecteurs, les déclarations et les propriétés personnalisées au fil de la frappe.
Mettez en forme avec la disposition que vous utilisez
Largeur d'indentation, un sélecteur par ligne ou plusieurs, une ligne vide entre les règles, commentaires gardés ou supprimés. Ce sont les quatre points sur lesquels les feuilles de style divergent réellement.
Ou minifiez, en gardant l'en-tête de licence
La convention `/*!` marque un commentaire qui doit survivre à la minification. L'interrupteur la respecte, et les chiffres avant/après/économisés vous disent si cela valait la peine.
Questions fréquentes
Pourquoi ne raccourcit-il pas `#ffffff` en `#fff` ?
Parce que chaque réécriture « sûre » a une feuille de style où elle ne l'est pas. Raccourcir les couleurs, fusionner les propriétés raccourcies, réordonner les déclarations et supprimer les règles « redondantes » changent chacune le comportement quelque part, et un minifieur qui casse une page en silence est pire qu'un minifieur qui économise moins d'octets. Gzip récupère de toute façon l'essentiel de la différence.
Que sont les « problèmes lexicaux » qu'il signale ?
Des endroits auxquels l'analyseur lexical n'a pas su donner de sens — un commentaire non fermé, une chaîne qui court jusqu'à la fin du fichier, une accolade égarée. Ils sont signalés avec un décalage en octets et le formateur continue, parce qu'une feuille de style dont une règle est cassée vaut encore la peine d'être lue.
Ajoute-t-il les préfixes constructeurs ?
Non. Préfixer demande une cible de compatibilité navigateur et une base de ce que chaque propriété exige, deux choses qui changent tous les mois. C'est le travail d'Autoprefixer, et il lui faut une étape de build pour le faire honnêtement.
Survit-il à une URL contenant un point-virgule ?
Oui — `url(dots;grid.png)` et une chaîne `content: "{ not a block; }"` sont tous deux lus comme un seul jeton chacun plutôt que coupés sur la ponctuation qu'ils contiennent. Ce cas figure dans l'exemple de la page précisément parce que les formateurs naïfs s'y trompent.
À alimenter depuis
Atlas de sprites
Sprite Sheet Packer
Range plusieurs images dans un seul atlas et produit à côté la feuille CSS ou la carte JSON des positions.
Formater ou minifier du HTML
HTML Beautifier & Minifier
Met en forme ou minifie du HTML en préservant les éléments en ligne, avec réduction facultative des espaces.
Formater ou minifier du JavaScript
JavaScript Beautifier & Minifier
Retire commentaires et espaces d’un JavaScript ou d’un TypeScript sans rien renommer, et réindente un bundle minifié pour qu’il redevienne lisible.
Générateur de dégradé CSS
CSS Gradient Builder
Compose des dégradés linéaires, radiaux et coniques avec des arrêts déplaçables et rend le CSS, en sRGB ou en OKLCH.
Ensuite
Ces outils acceptent ce que celui-ci produit : le résultat peut y aller directement.
Extracteur de jetons CSS
CSS Token Extractor
Extrait couleurs, espacements, rayons et polices d’une feuille de style et propose un jeu de propriétés personnalisées.
Formater ou minifier du HTML
HTML Beautifier & Minifier
Met en forme ou minifie du HTML en préservant les éléments en ligne, avec réduction facultative des espaces.
Formater ou minifier du JavaScript
JavaScript Beautifier & Minifier
Retire commentaires et espaces d’un JavaScript ou d’un TypeScript sans rien renommer, et réindente un bundle minifié pour qu’il redevienne lisible.
SVG en data URI CSS
SVG to CSS Data URI
Encode un SVG en data URI de fond CSS, en n’échappant que ce qui doit l’être pour rester court.
Encodeur et décodeur Base64
Base64 Encoder & Decoder
Encode et décode en Base64 et en Base64URL, pour du texte comme pour des fichiers, avec un traitement correct de l’UTF-8.
curl vers code
curl to Code
Traduit une commande curl en fetch, axios, requests Python, Go, PHP ou PowerShell.