Softonic

Conversor de Imagem para BASE64

Etapa 1 / 3
Restaurando o arquivo selecionado...

Uma URL de dados Base64 reúne o tipo de mídia e os bytes codificados de uma imagem em um único valor de texto, como data:image/png;base64,.... Escolha uma imagem de até 20 MiB e o conversor criará esse valor localmente no navegador. Antes de copiar, você verá os dados do arquivo original e o comprimento aproximado da URL gerada.

Como codificar uma imagem em base64

  1. 1

    Escolha uma imagem

    Selecione um arquivo de imagem de até 20 MiB.

  2. 2

    Codifique localmente

    O navegador lê o arquivo e cria uma URL de dados Base64 completa sem enviá-lo ao servidor.

  3. 3

    Confira o resultado

    Verifique o tipo de mídia, os dados do arquivo e o comprimento aproximado da URL gerada.

  4. 4

    Copie a URL de dados

    Copie o valor completo `data:image/...;base64,...` para a área de transferência.

Quando usar inline, quando usar link

A incorporação em Base64 economiza uma solicitação HTTP à custa de um aumento de tamanho de 33%, vale a pena para alguns ativos, desperdício para outros.

Cálculo de tamanho

Tamanho original Tamanho Base64 Bytes extras
1 KB 1.36 KB 360 B
10 KB 13.6 KB 3.6 KB
100 KB 136 KB 36 KB
1 MB 1.36 MB 360 KB

Guia de decisão

Caso de uso Inline ou externo
Ícone abaixo de 2 KB (logotipo SVG, sprite) Inline
Imagem do cursor em CSS (cursor: url()) Inline
Pequena demonstração HTML ou CSS autônoma Inline
Ícone incluído em uma carga JavaScript Inline
Imagem hero, > 50 KB Externo
Qualquer coisa que possa ser armazenada separadamente Externo

Formato de URI de dados

data:[<mediatype>][;base64],<data>

Exemplos:

  • data:image/png;base64,iVBORw0KGgo..., PNG
  • data:image/svg+xml;utf8,<svg>...</svg>, SVG, muitas vezes melhor inline sem base64
  • data:image/jpeg;base64,/9j/4AAQS..., JPG

Dicas

  • SVG é frequentemente melhor como url() com codificação utf8 em vez de base64; mais curto, legível.
  • A codificação não inspeciona nem higieniza a imagem. Incorpore somente arquivos confiáveis, principalmente SVG, que pode conter conteúdo ativo ou externo.
  • Imagens grandes dentro de cargas JSON bloqueiam a análise se forem muito grandes; considere referências multipart ou externas.
  • A imagem de fundo CSS com base64 é incorporada de forma limpa, mas derrota o cache entre páginas.

Perguntas frequentes

Base64 codifica 3 bytes de entrada como 4 caracteres, então a saída é sempre ~33% maior que a entrada. Uma imagem de 10 KB produz uma string de cerca de 13.600 caracteres. Longo é normal.

O conversor aceita uma imagem de até 20 MiB. Esse é um limite de processamento, não uma recomendação: URLs de dados devem ser pequenas, pois Base64 acrescenta cerca de um terço ao tamanho original e impede o cache separado.

Não. A codificação Base64 é executada no seu navegador. A imagem nunca sai do seu dispositivo.

Não neste codificador. Use a ferramenta separada Base64 para imagem para transformar uma URL de dados ou string Base64 bruta em um arquivo de imagem para download.

Ferramentas relacionadas

Seletor de Cores do Material Design

Navegue pela paleta de cores do Material Design. Copie qualquer tonalidade (50 a A700) como HEX, RGB ou HSL com um toque.

Gerador de papel pautado

Crie papel pautado para imprimir de graça. Escolha pauta média, larga ou estreita, defina o espaçamento das linhas em mm, o tamanho da página e uma linha de margem, e imprima ou baixe o SVG.

Gerador de papel quadriculado

Crie papel quadriculado para imprimir online: escolha grade ou pontos, ajuste o espaçamento em mm, selecione A4 ou Carta e uma cor de linha personalizada, e imprima ou baixe um SVG nítido.

Criador de gráficos de ponto cruz

Transforme JPEG, PNG ou WebP em gráfico de ponto cruz imprimível com 10–150 pontos, 2–40 cores próprias, símbolos, contagens exatas e medidas do tecido.

Divisor de Grade do Instagram

Divida uma imagem ampla em uma grade 3×3 do Instagram, ou qualquer número de linhas. As peças são numeradas para facilitar o upload em ordem inversa.

Conversor de Pantone para HEX

Converta cores Pantone PMS para os valores mais próximos de HEX, RGB e CMYK para correspondência em tela e impressão, com pré-visualização de amostras.

Ferramenta disponível em outros idiomas