Imagen a Base64
Convierte una imagen en un data URI Base64 para incrustarla directamente en CSS o HTML, o pega Base64 para convertirlo de nuevo en una imagen descargable. Todo funciona en tu navegador.
Convertir en el otro sentido
¿Necesitas pasar de Base64 de nuevo a una imagen? Usa la página dedicada:
Cómo convertir una imagen a Base64
- Suelta una imagen (o cambia a Base64 → Imagen y pega el Base64).
- Copia el data URI Base64: activa o desactiva el prefijo data:.
- Pégalo en tu CSS o HTML, o decodifícalo de nuevo a una imagen.
Acerca de la codificación Base64 de imágenes
Codificar una imagen como Base64 la convierte en una cadena de texto que puedes incrustar directamente en un fondo CSS, una etiqueta img de HTML o un payload JSON, sin necesidad de una petición de archivo aparte. Es práctico para iconos pequeños, imágenes en línea de correos y data URIs, aunque hace que los datos sean alrededor de un 33% más grandes, así que es mejor para recursos pequeños.
Esto convierte en ambos sentidos por completo en tu navegador: suelta una imagen para obtener su data URI, o pega un data URI / cadena Base64 para ver la vista previa y descargar la imagen. No se sube nada, así que tus imágenes privadas se quedan en tu dispositivo.
El tamaño no es el único inconveniente de la inclusión en línea. Una imagen en formato Base64 forma parte del documento que la contiene, por lo que el navegador no puede almacenarla en caché de forma independiente, cargarla de forma diferida ni reutilizarla en varias páginas, como sí puede hacer con un archivo de imagen normal; basta con cambiar un byte de la página para que se vuelva a descargar todo el contenido. Además, existen limitaciones en cuanto a la compatibilidad: algunos clientes de correo electrónico, especialmente Outlook, se niegan a mostrar imágenes con formato URI de datos.
Encontrarás imágenes en formato Base64 en muchos más lugares que en el código CSS escrito a mano. Las aplicaciones de dibujo en formato Canvas exportan sus resultados mediante `toDataURL`, los widgets de captura de pantalla y firma guardan su salida como URI de datos, las API devuelven las imágenes generadas como campos Base64 en formato JSON y las exportaciones de HTML en un solo archivo incrustan cada elemento gráfico directamente. Cuando una de estas cadenas aparece en tu trabajo (en un registro, una columna de base de datos o el código fuente de una página), decodificarla para obtener el archivo original suele ser la forma más rápida de ver su contenido.
Preguntas frecuentes
¿Qué es un data URI?
Un data URI incrusta los bytes de un archivo directamente en una URL como Base64, por ejemplo data:image/png;base64,…; puedes usarlo como origen de una imagen o como fondo CSS sin un archivo aparte.
¿Por qué el Base64 es más grande que el archivo?
Base64 representa 3 bytes con 4 caracteres ASCII, así que el texto es alrededor de un 33% más grande que la imagen original. Es mejor para recursos pequeños como iconos.
¿Puedo convertir Base64 de nuevo en una imagen?
Sí. Cambia a Base64 → Imagen, pega un data URI o Base64 sin procesar, y verás la vista previa y podrás descargar la imagen decodificada.
¿Se sube mi imagen?
No. Ambos sentidos funcionan por completo en tu navegador, así que tu imagen o Base64 nunca sale de tu dispositivo.
¿La codificación Base64 modifica o comprime mi imagen?
No. Base64 es una forma de representar los bytes exactos de un archivo utilizando 64 caracteres ASCII seguros; no se comprime, no se cambia el tamaño ni se vuelve a codificar, y la decodificación produce un archivo idéntico al original. La calidad no se ve afectada porque los píxeles no se modifican. Si necesita una cadena más corta, comprima o cambie el tamaño de la imagen antes de codificarla; Base64 por sí solo nunca reducirá el tamaño de un archivo.