onlinetools.dev

Conversor imagem ↔ Base64

Converta imagens em data URLs Base64 e vice-versa — com trechos CSS e HTML

Roda localmente
loading…
Sobre esta ferramenta

Solte, escolha ou cole uma imagem e receba seu Base64 em todos os sabores de que possa precisar: um data URL pronto para uso, uma declaração CSS background-image, uma tag <img> completa com as dimensões reais e o payload Base64 puro. O caminho inverso também funciona — cole um data URL ou um bloco de Base64 e a imagem é decodificada, pré-visualizada e baixável como arquivo.

O formato é identificado pelos bytes mágicos, não pela extensão nem pelo tipo MIME declarado, então um PNG renomeado para .jpg (ou um data URL com o rótulo errado) converte corretamente do mesmo jeito. O painel de tamanhos é honesto sobre o custo: Base64 infla os dados em cerca de um terço, e o tamanho codificado exato aparece ao lado do original para você decidir se embutir vale a pena.

Diferente da maioria dos sites de imagem para Base64, nada é enviado — o arquivo é lido com a API FileReader do navegador e codificado na própria página. Isso torna a ferramenta segura para capturas de painéis internos, imagens de produtos não lançados ou qualquer coisa que você prefira não entregar ao servidor de um estranho.

Perguntas frequentes

Quando devo embutir uma imagem como Base64 em vez de vincular um arquivo?
Quando a imagem é pequena (abaixo de ~10 KB), raramente muda e custaria uma requisição HTTP extra — ícones, logos em e-mails ou documentos HTML de arquivo único. Para qualquer coisa maior, o arquivo separado vence: é cacheado de forma independente, carrega em paralelo e não incha seu HTML ou CSS em 33%.
Por que a versão Base64 é cerca de um terço maior que meu arquivo?
Base64 representa cada 3 bytes binários como 4 caracteres ASCII, uma sobrecarga estrutural de +33% (mais até dois caracteres de preenchimento). Gzip ou Brotli no servidor recupera parte disso, mas a inflação é inerente à codificação — ela troca tamanho pela capacidade de embutir binário em texto.
Posso decodificar um data URL que encontrei em uma folha de estilos ou HTML?
Sim — mude para Base64 → imagem e cole tudo, prefixo data: incluído. Data URLs de SVG com percent-encoding (os sem ;base64) também decodificam, e quebras de linha ou espaços no payload são removidos automaticamente. O resultado aparece na página e baixa com a extensão correta.
Funciona com SVG, GIF e ICO, ou só com PNG e JPEG?
Tudo o que o detector reconhece converte para Base64: PNG, JPEG, WebP, GIF, SVG, BMP, ICO e AVIF. Para SVG em particular, considere que o código XML costuma ser menor e mais legível embutido diretamente — codificar SVG em Base64 faz sentido principalmente quando aspas ou escaping viram problema.
Ferramentas relacionadas