Codificador de URL SVG
Converta a marcação SVG em um URI de dados pronto para CSS e decodifique URIs de dados de volta para SVG.
Codificador de URL SVG
Cole um SVG e obtenha um URI de dados que você pode colocar diretamente no CSS, pronto para imagem de fundo ou máscara. Em vez de base64, o codificador usa a abordagem compacta de codificação de URL: ele troca aspas duplas por aspas simples, recolhe os espaços em branco e codifica por cento apenas os caracteres que realmente precisam deles, para que o resultado permaneça curto e legível por humanos. Isso mantém sua folha de estilo menor que um blob base64 e ainda permite reconhecer as formas dentro do URI.
Três formatos de saída cobrem os casos comuns. A regra CSS agrupa o URI de dados em imagem de fundo: url("…"); para que você possa colar uma declaração inteira. O URI de dados simples fornece apenas o valor de uma propriedade personalizada, um <img> src ou uma máscara SVG. O formulário base64 produz um URI data:image/svg+xml;base64 seguro para UTF-8 para ferramentas ou etapas de construção que esperam essa codificação, incluindo SVGs com emoji ou nós de texto acentuados.
Mude a direção para decodificação e a ferramenta reverte qualquer uma das três formas de volta à marcação SVG bruta. Cole uma regra CSS, um URI de dados simples ou base64, e ele extrai o SVG para que você possa editar um ícone que só existe dentro de uma folha de estilo. A contagem mostra o tamanho da entrada, o tamanho da saída e a alteração percentual, para que você possa ver rapidamente se a codificação diminuiu ou aumentou o ícone.
Tudo roda no seu navegador. Sua marcação SVG nunca é carregada, então você pode codificar ícones privados, logotipos e ativos internos sem que eles saiam do seu dispositivo.