Imagem para Base64
Transforme uma imagem em um código Base64 para colar direto em HTML, CSS, JSON ou em um modelo de e-mail.
ou arraste para cá · até 50 MB, grátis
Arquivos maiores? Com o Pro você converte arquivos de até 500 MBAcima dos limites grátis: você pode liberar o download a partir de € 1,99.
Processando…
Seu arquivo está pronto
Grátis · Sem cadastro · Sem marca d’água · Seus arquivos nunca saem do seu dispositivo
Imagem para Base64 em 3 passos
- Selecione sua imagem ou arraste-a para a caixa.
- Escolha o resultado: data URI, só Base64, CSS ou tag HTML.
- Clique em Converter para Base64 e copie o código ou baixe-o como arquivo .txt.
Quando incorporar uma imagem em Base64
O Base64 escreve os bytes de um arquivo como texto simples, então uma imagem pode ficar dentro de uma página HTML, de uma folha de estilo, de um JSON ou de uma assinatura de e-mail, em vez de ser um arquivo separado. Isso economiza uma requisição em ícones e logos pequenos, e é o único jeito de enviar uma imagem por algumas APIs e campos de formulário que só aceitam texto.
O preço é o tamanho: o texto Base64 fica cerca de um terço maior que a imagem e não pode ser guardado em cache separadamente. Use para imagens de poucos kilobytes e deixe as fotos como arquivos normais. Para ter o menor código possível, comprima a imagem antes, ou use SVG para logos e ícones, que também ficam nítidos em qualquer tamanho.
Perguntas frequentes
Como converter uma imagem em Base64?
Selecione uma imagem aqui, escolha o formato do resultado e clique em Converter para Base64. O código aparece em uma caixa com o botão Copiar, e você também pode baixá-lo como arquivo .txt. Funciona com imagens JPG, PNG, GIF, WebP, SVG, AVIF, BMP e ICO.
O que é uma data URI?
Uma data URI é o texto Base64 com um prefixo curto que informa ao navegador o tipo do arquivo, como data:image/png;base64, seguido do código. Você pode usá-la em qualquer lugar onde se espera a URL de uma imagem, por exemplo no src de uma tag img ou no url() do CSS.
Como usar Base64 em HTML ou CSS?
Escolha "Tag HTML <img>" para receber um elemento img pronto, ou "CSS background-image" para receber uma linha que você pode colar em uma regra de estilo. Os dois contêm a data URI completa, então a imagem aparece sem um arquivo separado.
Por que o Base64 é maior que a imagem?
O Base64 usa 4 caracteres de texto para cada 3 bytes, então o código fica cerca de 33% maior que o arquivo. Isso não é problema para ícones pequenos, mas pesa rápido em fotos. Comprima ou redimensione a imagem antes se o código ficar longo demais.
Minha imagem é enviada para algum servidor?
Não. A imagem é lida e codificada dentro do seu navegador, no seu próprio dispositivo, então nunca é enviada para nós nem fica guardada em lugar nenhum. Depois que a página carrega, a ferramenta continua funcionando mesmo sem conexão com a internet.