Qué hace esta herramienta
Este conversor transforma una imagen en texto Base64 y te da el código en el formato que necesites: un data URI completo (data:image/png;base64,…), la cadena Base64 sola, una etiqueta HTML <img> lista para usar, una regla CSS background-image o Markdown. Funciona con archivos JPG, PNG, WebP, GIF, BMP y SVG, y muestra el tamaño original y el codificado para que veas cuánto cuesta incrustar la imagen.
También funciona al revés. Pega datos Base64 o un data URI (por ejemplo, de una respuesta JSON, del código fuente de un correo o de una hoja de estilos) y la herramienta muestra la imagen que contiene, detecta su tipo y te permite descargarla como un archivo normal.
Todo se ejecuta en tu navegador. Ni tus imágenes ni tus datos Base64 se envían a ningún servidor.
Cuándo usarla
Iconos pequeños en CSS y HTML
Incrusta iconos diminutos, indicadores de carga o logotipos directamente en una hoja de estilos o una página para ahorrar una petición HTTP.
Firmas de correo y newsletters
Algunas herramientas de correo necesitan las imágenes incrustadas como data URI en lugar de archivos enlazados.
API y JSON
Muchas API envían y reciben imágenes como cadenas Base64. Crea datos de prueba o comprueba lo que ha devuelto una API.
Documentos de un solo archivo
Crea informes HTML, demos o páginas sin conexión autónomos que incluyan sus propias imágenes.
Consejos para obtener el mejor resultado
- Usa Base64 solo con imágenes pequeñas. A partir de unos 10 KB, un archivo de imagen normal suele ser más rápido, porque el navegador puede guardarlo en caché por separado.
- Comprime la imagen antes de convertirla: cada kilobyte que ahorras te ahorra también 1,33 KB de texto Base64.
- Los iconos SVG a menudo se pueden incrustar de forma aún más compacta como SVG codificado para URL, pero Base64 funciona en todas partes.
- Si falla la decodificación, asegúrate de haber copiado la cadena completa, incluido el final, y nada más.
Cómo funciona
El archivo de imagen se lee con la API FileReader del navegador, que genera un data URI: el tipo MIME del archivo seguido de sus bytes codificados en Base64. Los demás formatos se construyen a partir de esa cadena.
Para decodificar, la herramienta quita el prefijo de data URI si lo hay, limpia los espacios en blanco, acepta Base64 apto para URL y añade el relleno que falte. Después comprueba los primeros bytes (el «número mágico») para reconocer PNG, JPEG, GIF, WebP, BMP o SVG, de modo que puede mostrar y guardar la imagen con el tipo correcto aunque no se indique ningún tipo MIME.
Base64 representa cada 3 bytes con 4 caracteres de texto; por eso las imágenes codificadas ocupan aproximadamente un tercio más que el archivo original.