Gerador de data URI
Converta qualquer arquivo ou texto em uma data: URI com o tipo MIME certo, em Base64 ou com codificação percentual, mais trechos prontos de <img> e background CSS.
O que é Gerador de data URI?
Uma data URI embute um arquivo diretamente em HTML, CSS ou JSON como data:<mime>;base64,<data>, sem precisar de uma requisição separada. Esta ferramenta converte qualquer arquivo (imagens, fontes, SVG, PDFs…) ou texto digitado em uma data URI, detecta o tipo MIME, permite escolher Base64 ou codificação percentual e entrega trechos HTML e CSS correspondentes.
Como usar Gerador de data URI
- Escolha Arquivo e solte um arquivo, ou escolha Texto e digite o conteúdo.
- Confira ou edite o Tipo MIME.
- Deixe a Codificação Base64 ativada para arquivos binários; desative-a para aplicar codificação percentual em texto e SVG (muitas vezes fica menor).
- Copie a data URI ou o trecho HTML / CSS.
Exemplo
Text: Hello, World! (Base64 on)
data:text/plain;base64,SGVsbG8sIFdvcmxkIQ==
Quando usar Gerador de data URI
Use data URIs para assets pequenos: ícones, SVGs minúsculos, imagens placeholder, fontes em demos de arquivo único ou templates de e-mail e fixtures de teste. Evite-as em sites para arquivos maiores que alguns kilobytes: o Base64 acrescenta cerca de 33% ao tamanho e os dados embutidos não podem ser armazenados em cache separadamente da página ou da folha de estilo.
Como funciona Gerador de data URI
O arquivo é lido como bytes no navegador. O tipo MIME vem do navegador ou da extensão do arquivo. Com Base64, os bytes são codificados com o alfabeto padrão (RFC 4648) e escritos como data:<mime>;base64,… (RFC 2397). Sem Base64, o conteúdo é decodificado como UTF-8 e recebe escape com encodeURIComponent, e ;charset=utf-8 é acrescentado para tipos de texto. Imagens ganham uma prévia, e o tamanho do resultado é exibido.
Casos de Uso Comuns
- Embutir um ícone SVG pequeno em background-image no CSS
- Incorporar imagens em um relatório HTML de arquivo único
- Colocar uma imagem minúscula em uma fixture de API JSON
- Criar uma imagem de assinatura de e-mail autossuficiente
Perguntas Frequentes
Por que a data URI é maior que o meu arquivo?
O Base64 codifica cada 3 bytes como 4 caracteres, então o resultado fica cerca de 33% maior. A codificação percentual de texto ou SVG muitas vezes fica menor.
Meu arquivo é enviado?
Não. O arquivo é lido e codificado inteiramente no seu navegador.
Qual é o limite de tamanho?
A ferramenta aceita arquivos de até 20 MB, mas navegadores e clientes de e-mail lidam mal com data URIs grandes; mantenha-as pequenas.