Imagem para Base64

Quando vale a pena incorporar

Uma URL de dados economiza uma requisição, mas não pode ser armazenada em cache separadamente: ela é baixada novamente com cada cópia do HTML ou CSS que a contém e fica cerca de um terço maior que o arquivo. Essa troca funciona para imagens minúsculas de poucos kilobytes, como um ícone em uma folha de estilos ou um placeholder desfocado. Fotos e imagens reutilizadas em várias páginas carregam mais rápido como arquivos comuns. Para SVG, codificar a marcação na URL em vez de usar Base64 geralmente produz uma URL de dados mais curta.

Onde URLs de dados não funcionam

O Gmail e muitos outros clientes de e-mail não exibem imagens incorporadas como URLs de dados; portanto, em newsletters, use o link para uma imagem hospedada. Muitas APIs que aceitam imagens Base64 querem apenas o payload: exclua tudo até e incluindo a vírgula depois de base64. Uma página com uma Política de Segurança de Conteúdo precisa listar data: na diretiva img-src para que as imagens incorporadas sejam carregadas.

Como usar

1. Escolha uma imagem.
2. Codifique localmente.
3. Copie a URL de dados resultante.

Privacidade e limitações

O arquivo permanece no seu dispositivo. Base64 é uma codificação, não criptografia, e aumenta o tamanho em cerca de um terço.