Tool Hub

SVG to Code

Convertit balisage SVG en code HTML / JSX / Vue SFC

Collez du balisage SVG et convertissez-le en code HTML, JSX ou Vue propre. Gère automatiquement la conversion d'attributs (p. ex., class → className pour JSX).

Comment utiliser

  1. Sélectionnez un mode de sortie : HTML, JSX (React) ou Vue Template.
  2. Collez votre balisage SVG dans le champ d'entrée.
  3. Lisez le code converti dans le champ de sortie, où le mode JSX renomme class en className et convertit les attributs kebab-case en camelCase.
  4. Copiez la sortie avec le bouton de copie.
  5. Vérifiez l'aperçu SVG en direct sous la sortie pour confirmer que le graphique semble correct.

Exemples

  • Coller un SVG avec class="icon" et stroke-width="2" en mode JSX génère className="icon" et strokeWidth="2".
  • Changer la même entrée au mode Vue Template remplace class= par :class= tout en gardant tous les autres attributs inchangés.

Vérifiez les sorties avant utilisation en production. Aucune garantie — voir Conditions.