Como usar
- Arraste imagens até a área de arrastar e soltar, clique nela para escolher arquivos ou cole uma imagem da área de transferência. Você pode adicionar vários arquivos de uma vez.
- Se quiser, escolha um formato de destino (PNG, JPEG ou WebP) em Converter para, ajuste a Qualidade e defina uma Largura máxima.
- Confira as dimensões, o tamanho original e o tamanho codificado exibidos para cada imagem.
- Copie ou baixe a saída de que você precisa: data URI, Base64 puro, tag img do HTML, background-image do CSS ou Markdown.
Como funciona a conversão de imagem para Base64
O Base64 transforma os bytes de um arquivo de imagem em texto simples formado por 64 caracteres. Cada 3 bytes viram 4 caracteres, então o texto fica cerca de 33% maior que o arquivo. Um data URI acrescenta um prefixo curto com o tipo MIME, como data:image/png;base64,, o que permite ao navegador exibir o texto em qualquer lugar onde ele espera a URL de uma imagem.
A imagem é lida e codificada localmente no seu navegador. Ela não é enviada a nenhum servidor, então capturas de tela privadas e designs ainda não lançados ficam no seu dispositivo.
Qual saída você deve copiar?
- Data URI para atributos
src, JavaScript e campos JSON que esperam uma URL. - Base64 puro para APIs que querem apenas os bytes codificados, geralmente ao lado de um campo separado para o tipo MIME ou o nome do arquivo.
- Tag img do HTML para colar diretamente em uma página ou template.
- background-image do CSS para ícones e elementos decorativos em uma folha de estilo.
- Markdown para documentação e anotações. Alguns renderizadores, incluindo o do GitHub, não exibem imagens em data URI.
Formatos compatíveis em resumo
Os primeiros caracteres de uma string Base64 revelam o tipo de arquivo, porque codificam a assinatura do formato.
| Formato | Tipo MIME | O Base64 começa com |
|---|---|---|
| PNG | image/png | iVBORw0KGgo |
| JPEG | image/jpeg | /9j/ |
| WebP | image/webp | UklGR |
| GIF | image/gif | R0lGOD |
| SVG | image/svg+xml | PHN2Zy ou PD94bWw |
| BMP | image/bmp | Qk |
| ICO | image/x-icon | AAABAA |
| AVIF | image/avif | varia |
| TIFF | image/tiff | SUkqAA ou TU0AKg |
Quando vale a pena incorporar uma imagem
Data URIs economizam uma requisição de rede e tornam o arquivo autossuficiente. Isso é ideal para ícones e logotipos pequenos, de poucos kilobytes, relatórios HTML em arquivo único, pequenos placeholders desfocados e imagens enviadas dentro de JSON. Já para fotos grandes eles são uma má escolha: o terço a mais de tamanho, a falta de um cache separado no navegador e um arquivo HTML ou CSS mais pesado, que precisa ser baixado antes que qualquer coisa seja renderizada, geralmente custam mais do que a requisição economizada. Se o seu site envia um cabeçalho Content-Security-Policy, as imagens incorporadas também exigem data: em img-src.
Perguntas frequentes
Minhas imagens são enviadas para um servidor?
Não. O navegador lê cada arquivo e o codifica no seu dispositivo. Nada é enviado ao base64.is nem a qualquer outro lugar.
Por que o texto Base64 é maior que a imagem?
O Base64 usa 4 caracteres a cada 3 bytes, então o resultado fica cerca de 33% maior, mais o prefixo do data URI. Para encurtá-lo, defina uma Largura máxima ou converta para WebP ou JPEG com uma qualidade menor.
Posso converter várias imagens de uma vez?
Sim. Selecione ou solte vários arquivos. Cada imagem ganha sua própria prévia, seus tamanhos e suas saídas, cada uma com os botões Copiar e Baixar.
Imagens em Base64 funcionam em e-mails HTML?
cid: são mais confiáveis.