¿Odias los anuncios? Ir Sin publicidad Hoy 

Vista previa y decodificador de imagen Base64

DatosDesarrolladorImagen

ANUNCIO · ¿ELIMINAR?

APORTE

Proceso automático

PROD.

Lado cliente

ANUNCIO · ¿ELIMINAR?

Guía

Vista previa y decodificador de imagen Base64

Pega una cadena de imagen base64 y prevé inmediatamente la imagen renderizada, con el formato detectado automáticamente a partir de los bytes mágicos del archivo. Las dimensiones en píxeles y el tamaño en bytes decodificados se calculan en tu navegador – sin subida a servidor, sin esperar a una API. Opcional data: El prefijo URI se elimina automáticamente, así que puedes pegar una cadena base64 bruta de un payload JSON, un fondo CSS, un cuerpo de correo electrónico o una respuesta generada de SDK y funcionará sin problemas.

Cómo Usar

Copia la cadena base64. Puede ser el payload bruto o incluir el data:image/...;base64, prefijo URI – ambos son aceptados.
Pégalo en el Cadena Base64 campo. La herramienta decodifica y muestra la imagen en cuanto dejas de escribir.
Inspecciona el formato detectado, las dimensiones en píxeles, el tamaño en bytes decodificado y el conteo de caracteres de la base64 original.
Haz clic en Descargar imagen para guardar el archivo decodificado en tu computadora con la extensión correcta para el formato detectado.

Características

Detección automática de formato de imagen – PNG, JPEG, GIF, WebP, BMP, ICO, SVG, AVIF y HEIC son reconocidos a partir de los bytes mágicos, no solo a partir de la pista del URI de datos.
Dimensiones en píxeles – Ancho y alto se leen de la imagen renderizada, así que ves el tamaño intrínseco real.
Tamaño del archivo decodificado – Muestra el conteo real de bytes binarios tras el decodificación, junto con la longitud en caracteres de la base64 para comparar.
Elimina el prefijo de URI de datos – Funciona independientemente de si la entrada comienza con data:image/png;base64,, simplemente iVBORw0...o una variante segura para URLs.
Descarga como archivo de imagen – Un clic guarda los bytes decodificados con la extensión correcta para el formato detectado.
Línea pura en el navegador – La cadena base64 nunca abandona tu navegador. Es seguro usarla con capturas privadas, activos internos o archivos sensibles de diseño.

Cuándo usar esta herramienta

Usa esta herramienta cada vez que encuentres una cadena base64 de imagen y necesites confirmar qué es realmente – para depurar respuestas de API que incluyen miniaturas, inspeccionar correos electrónicos o HTML que incluyan imágenes, reverse-engineer píxeles de seguimiento, verificar el resultado de una API de generación de imágenes o recuperar un activo de una exportación de base de datos. Dado que el renderizado ocurre en el navegador, también es una forma rápida de verificar que una cadena base64 está bien formada antes de enviarla a producción.

ANUNCIO · ¿ELIMINAR?

 Preguntas frecuentes

¿Qué es el codificado base64 y por qué se usa para imágenes?

Base64 es un esquema de codificación que representa datos binarios arbitrarios usando 64 caracteres imprimibles del alfabeto ASCII. Existe porque muchos canales de transporte – JSON, atributos HTML, cuerpos de correo, URLs, XML clásico – no pueden transportar bytes de forma segura. Codificar una imagen en base64 permite incluir todo el archivo como una cadena en un contexto de texto solo, a costa de un aumento de tamaño de aproximadamente un tercio.
¿Cómo funciona una URI de datos en HTML y CSS?

Una URI de datos sigue el formato data:[mediatype][;base64],<payload>. Cuando el navegador ve esto en un img src, un atributo CSS background-imageo otro atributo de recurso, no realiza una solicitud de red – decodifica el payload incluido y lo trata como el recurso. Esto elimina un viaje de red, pero hace que el HTML o CSS circundante sea más grande y no cachable por sí solo.
¿Por qué los datos de imagen codificados en base64 son más grandes que el original?

Base64 empaqueta cada tres bytes de datos binarios en cuatro caracteres ASCII, lo que produce un aumento de tamaño de 33%. Los caracteres de relleno y cualquier formato de línea elevan un poco ese costo. Como regla general, una cadena base64 es aproximadamente 1.37 veces el tamaño del archivo original una vez que se eliminan los efectos de compresión en el nivel HTTP.
¿Qué formatos de imagen pueden ser codificados en base64?

Cualquier formato de imagen puede ser codificado – base64 es independiente de formato y simplemente representa los bytes del archivo. Los navegadores pueden renderizar PNG, JPEG, GIF, WebP, BMP, ICO, SVG y cada vez más AVIF y HEIC desde una URI de datos, siempre que se declare el tipo de medio adecuado en el prefijo o se detecte a partir de los bytes mágicos del archivo.
¿Cuándo el enlazar una imagen en base64 perjudica en lugar de ayudar el rendimiento?

El enlazar es económico para una imagen pequeña guardada en un camino crítico, pero deja de ser beneficioso para archivos más grandes. Un payload en base64 no puede ser cachado por separado del documento en el que está incluido, bloquea el flujo de marcado circundante y obliga al navegador a reanalizar los mismos bytes en cada carga de página. Para cualquier cosa superior a unos pocos kilobytes, una solicitud normal con caché HTTP es casi siempre más rápida. <img> Pega una cadena base64 codificada de imagen (con o sin el prefijo de URI de datos)