Imagem para Base64 Online para CSS e HTML
Base64 permite inserir imagens pequenas diretamente no código. Converta um arquivo em texto sem enviá-lo a um servidor.
Base64 transforma os dados binários de uma imagem em texto que pode ser embutido em CSS, HTML ou JSON. Use o conversor de imagem para Base64 para obter um texto pronto para colar.
Quando usar
A técnica funciona bem para ícones pequenos, logotipos simples e ativos que precisam ser incluídos em um único arquivo HTML. Esse formato também simplifica protótipos e e-mails em HTML básico.
- Use em imagens pequenas para o tamanho do arquivo não crescer demais.
- Prefira WebP ou SVG quando houver suporte.
- Evite Base64 em fotos grandes.
- Guarde o arquivo original para editar depois.
Atenção ao tamanho
Base64 acrescenta cerca de um terço ao tamanho dos dados, e imagens embutidas nem sempre são armazenadas em cache separadamente. Para ativos grandes, continue usando arquivos de imagem normais. Depois de converter, cole o texto no código e teste a página no navegador.
Alternativa para ativos grandes
Para imagens que mudam com frequência, mantenha arquivos separados para o navegador conseguir fazer cache. Base64 é melhor para ativos pequenos, raramente alterados e que precisam chegar em uma única requisição. Teste a velocidade da página depois de colar.
Perguntas frequentes
Base64 serve para fotos grandes?
Não. Os dados ficam maiores e a página pode ficar lenta.
Quais formatos são aceitos?
PNG, JPG, WebP, GIF e SVG, conforme o arquivo escolhido.
O tamanho dos dados aumenta?
Sim, cerca de um terço em relação ao arquivo original.
A imagem é enviada?
Não. A conversão roda no navegador e o arquivo não sai do aparelho.