ximg.es

Imaxe a Base64

Arrastra unha imaxe para obter o seu data URI e os fragmentos listos para HTML, CSS e JSON. Tamén ao revés: pega un Base64 e descarga a imaxe. Todo ocorre no teu navegador.

Miniatura da imaxe convertida

icono.svg · image/svg+xml · 16 × 16 px · 121 B → 190 B como data URI (+57 %)

Codificación do SVG

De Base64 a imaxe

Que é un data URI

É unha forma de meter un ficheiro dentro do propio código, en vez de ligalo: data:image/png;base64,iVBORw0…. O navegador leo coma se fose un URL, así que serve en calquera sitio onde iría o enderezo dunha imaxe: o src dunha <img>, un url() de CSS ou un campo dun JSON.

Cando compensa (e cando non)

Base64 ocupa un 33 % máis ca o ficheiro orixinal e non se pode gardar na caché por separado: se a imaxe está no CSS, descárgase de novo cada vez que cambia o CSS. Compensa para:

Para fotos e para calquera imaxe grande é mellor un ficheiro normal, con loading="lazy" e en WebP ou AVIF.

SVG: mellor sen Base64

Un SVG é texto, así que pode ir no data URI case tal cal, escapando só uns poucos caracteres. Esa versión «URL-encoded» ocupa bastante menos ca en Base64 e segue a ser lexible. Cando convertes un SVG, a ferramenta déixache escoller.

Privacidade

A conversión faise coa API FileReader do navegador: a imaxe non se sobe a ningún servidor. O botón de proba descarga un placeholder do xerador de ximg.es, como https://ximg.es/64x64/2563eb/fff, e convérteo igual que se fose teu.

Preguntas frecuentes

Canto ocupa unha imaxe en Base64?

Arredor dun 33 % máis ca o ficheiro orixinal: Base64 usa 4 caracteres por cada 3 bytes. Unha imaxe de 30 KB pasa a uns 40 KB.

Súbense as miñas imaxes a algún servidor?

Non. Todo se fai no teu navegador con FileReader; podes desconectarte de internet e a ferramenta segue funcionando.

Como poño unha imaxe Base64 en CSS?

Dentro de url(), entre comiñas: background-image: url("data:image/png;base64,…"). A ferramenta dáche o fragmento completo.

Funcionan as imaxes Base64 nos correos?

En Apple Mail e en moitos clientes móbiles, si; Gmail e algunhas versións de Outlook bloquéanas. Para un boletín é máis seguro ligar a imaxe cun URL absoluto.

Como converto un Base64 en imaxe?

Pégao en «De Base64 a imaxe». Acepta o data URI completo ou só o Base64; nese caso, o tipo dedúcese dos primeiros bytes.

É mellor Base64 ou un SVG en liña?

Para SVG, mellor o código SVG en liña ou o data URI URL-encoded: ocupan menos ca en Base64 e comprímense mellor con gzip.

Máis ferramentas

Ver todas as ferramentas · Xerador de imaxes placeholder