Imagem para Base64

Este conversor de imagem para Base64 transforma uma foto em um data URI, uma longa string de texto que incorpora a imagem diretamente, além de um trecho de fundo CSS pronto para usar. Você pode embutir uma imagem em vez de fazer um link para um arquivo separado.

Ele funciona localmente no seu navegador, então sua imagem é lida no seu dispositivo e nunca é enviada.

Um data URI carrega a imagem inteira dentro do markup, então o navegador não faz uma requisição de rede separada para buscá-la. Para recursos pequenos como ícones, essa ida e volta economizada pode fazer uma página parecer mais rápida.

O problema é o tamanho e o cache. O Base64 adiciona cerca de 33 por cento de sobrecarga porque representa dados binários com um alfabeto de texto limitado, e uma imagem embutida não pode ser armazenada em cache separadamente, então ela é baixada de novo com cada página que a contém.

A regra prática é embutir imagens pequenas, ícones, logotipos minúsculos ou um sprite, onde evitar uma requisição vale a sobrecarga, e manter imagens maiores como arquivos normais que o navegador pode armazenar em cache e carregar em paralelo.

Data URIs funcionam em qualquer lugar onde uma URL é aceita: um img src, um fundo CSS ou um campo em JSON ou um template de e-mail. Isso os torna práticos para trechos autossuficientes.