Encodeur d'URL SVG
Convertissez le balisage SVG en un URI de données compatible CSS et décodez les URI de données en SVG.
Encodeur d'URL SVG
Collez un SVG et obtenez un URI de données que vous pouvez déposer directement dans CSS, prêt pour une image d'arrière-plan ou un masque. Au lieu de base64, l'encodeur utilise l'approche compacte de codage d'URL : il remplace les guillemets doubles par des guillemets simples, réduit les espaces et code en pourcentage uniquement les caractères qui en ont réellement besoin, de sorte que le résultat reste court et lisible par l'homme. Cela maintient votre feuille de style plus petite qu'un blob base64 et vous permet de toujours reconnaître les formes à l'intérieur de l'URI.
Trois formats de sortie couvrent les cas courants. La règle CSS encapsule l'URI des données dans background-image : url("…"); vous pouvez donc coller une déclaration entière. L'URI des données nues vous donne uniquement la valeur d'une propriété personnalisée, un src <img> ou un masque SVG. Le formulaire base64 produit un URI data:image/svg+xml;base64 sécurisé UTF-8 pour les outils ou les étapes de construction qui attendent cet encodage, y compris les SVG avec des emoji ou des nœuds de texte accentués.
Basculez vers le décodage et l’outil inverse l’une des trois formes en balisage SVG brut. Collez une règle CSS, un URI de données nues ou une base64, et il extrait le SVG afin que vous puissiez modifier une icône qui n'existe que dans une feuille de style. Le décompte indique la taille d'entrée, la taille de sortie et le pourcentage de changement, afin que vous puissiez voir en un coup d'œil si l'encodage a réduit ou agrandi l'icône.
Tout fonctionne dans votre navigateur. Votre balisage SVG n'est jamais téléchargé, vous pouvez donc encoder des icônes privées, des logos et des ressources internes sans qu'ils quittent votre appareil.