Formateur CSS

Nettoyez le CSS désordonné ou minifié avec une indentation et une structure cohérentes. Copiez ou téléchargez le résultat.

Entrée
Sortie
0 caractères 0 lignes

Formateur CSS

Cet outil embellit le code CSS en ajoutant une indentation correcte, des retours à la ligne et un formatage cohérent. Collez du CSS minifié ou mal formaté pour obtenir une sortie propre et lisible instantanément.

L'opération s'exécute localement dans votre navigateur. Vos données ne sont jamais téléchargées ni stockées sur un serveur.

Comment utiliser

  1. Collez votre code CSS dans l'éditeur d'entrée.
  2. Cliquez sur Embellir CSS pour nettoyer le code.
  3. Le CSS embell apparaît dans l'éditeur de sortie avec une indentation correcte.
  4. Utilisez Copier pour le presse-papiers, Télécharger pour un fichier, ou Effacer pour réinitialiser.

Qu'est-ce que l'embellissement CSS ?

L'embellissement CSS ajoute de l'indentation et des retours à la ligne au code CSS, le rendant lisible par l'homme. Le CSS minifié a tous les espaces supprimés pour réduire la taille du fichier, mais est difficile à lire.

L'embellissement CSS est essentiel pour le débogage des styles, l'examen des frameworks et la collaboration.

Notes d'entrée

L'outil accepte toute entrée CSS. L'embellisseur préserve tous les styles et sélecteurs.

Exemple

Le CSS minifié devient lisible après embellissement :

--- Minified Input ---
body{margin:0;padding:0;font-size:16px;}.container{max-width:1200px;}

--- Beautified Output ---
body {
  margin: 0;
  padding: 0;
  font-size: 16px;
}

.container {
  max-width: 1200px;
}

Intégration MCP

MCP (Model Context Protocol) permet aux agents IA et aux applications de découvrir et d'exécuter les utilitaires Coding.Tools pour des workflows répétables de conversion, formatage, hachage et génération.

Nom de l'outil MCP: css-beautifier

Point de terminaison MCP: https://coding.tools/mcp

Appelez d'abord tools/list. Chaque outil inclut inputSchema, outputSchema et examples afin qu'un agent IA ou un client puisse construire des arguments valides sans deviner.

Pour tools/call, lisez result.content[0].text pour la valeur affichable et result.structuredContent pour l'analyse par programme. Les échecs d'outil renvoient isError: true ; les échecs de protocole renvoient une JSON-RPC error.

Exemple de requête tools/call :

curl -s https://coding.tools/mcp \
  -H "Content-Type: application/json" \
  -H "Accept: application/json" \
  -H "MCP-Protocol-Version: 2025-06-18" \
  -d '{"jsonrpc":"2.0","id":1,"method":"tools/call","params":{"name":"css-beautifier","arguments":{"input":".button{color:white;background:#3366cc;padding:8px 12px;}"}}}'

La plupart des outils de texte et de données acceptent une chaîne input et des options facultatives. Les outils d'image qui dépendent des API d'image du navigateur sont listés pour la découverte et renvoient un lien vers l'interface Web si nécessaire.