> base64 | decode | PNG <
// Decodifica strings Base64 y URIs de datos de vuelta a imágenes PNG — con alfa preservado, vista previa instantánea y descarga en un clic
El PNG decodificado aparecerá aquí
Precisión bit a bit
El PNG decodificado es byte a byte idéntico al original — alfa, paleta y perfil de color hacen el round-trip sin alteraciones.
Decodificación local
El payload Base64 se decodifica en tu navegador con atob(). Sin subida al servidor, sin logs de los bytes de tu PNG.
Vista previa en vivo
Ve la imagen decodificada, sus dimensiones y el tamaño aproximado del archivo al instante antes de descargar.
// ACERCA DE BASE64 A PNG
Qué acepta esta herramienta
- >URI de datos: data:image/png;base64,iVBORw0KGgo…
- >Payload Base64 de PNG en crudo (empieza por iVBORw0KGgo)
- >Base64 con espacios / saltos de línea embebidos
- >Alfabeto estándar RFC 4648 (+/, padding = opcional)
- >Base64 URL-safe (-_) — se normaliza automáticamente al decodificar
- >Pegado con soporte Unicode — los BOM se eliminan
Casos de uso habituales
- >Guardar una captura de pantalla desde la URI de datos del inspector del DOM
- >Extraer un logo desde un fondo CSS con URI de datos
- >Recuperar una imagen desde una respuesta de API JSON
- >Restaurar una imagen desde una columna TEXT de base de datos
- >Recuperar un PNG desde una parte MIME de correo
- >Inspeccionar un icono incrustado dentro de un SVG inline
- >Depurar una etiqueta <img src="data:image/png;base64,…"> rota
Cómo funciona la decodificación Base64 → PNG
El decodificador elimina cualquier prefijo de URI de datos, normaliza los espacios y los caracteres URL-safe, y luego llama a atob() para convertir cada grupo de 4 caracteres de vuelta en 3 bytes binarios. El array de bytes se envuelve en un Blob con tipo MIME image/png, se le asigna una object URL y se renderiza en un elemento <img>. Como Base64 es biyectivo respecto al binario, la salida es idéntica bit a bit al PNG original — un SHA-256 del archivo decodificado coincide con el original.
URI de datos PNG de ejemplo:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==
Rendimiento y compatibilidad
- >Decodificación O(n) en función de la longitud del payload — soporta 100 MB+ sin problema
- >Usa el atob() nativo del navegador — sin shims JS pesados
- >Soporta APNG multi-frame cuando el visor lo soporta
- >Funciona en todos los navegadores modernos (Chrome, Firefox, Safari, Edge)
- >Vista previa responsive en móvil con zoom mediante pellizco
- >La descarga usa una Blob URL — sin viaje intermedio al servidor
// CÓMO DECODIFICAR BASE64 A PNG
Paso 1: Pegar
Pega la cadena Base64 o la URI de datos completa en el campo de entrada
Paso 2: Decodificar
Haz clic en [DECODE] — el PNG se renderiza en la vista previa al instante
Paso 3: Inspeccionar
Comprueba dimensiones, tamaño de archivo y canal alfa antes de guardar
Paso 4: Descargar
Haz clic en [DOWNLOAD .png] para guardar un PNG idéntico bit a bit en disco
// EJEMPLOS DE CÓDIGO — BASE64 A PNG
JavaScript (Navegador)
// Decode Base64 → PNG Blob → download link
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
const bin = atob(b64);
const arr = new Uint8Array(bin.length);
for (let i = 0; i < bin.length; i++) arr[i] = bin.charCodeAt(i);
const blob = new Blob([arr], { type: 'image/png' });
const url = URL.createObjectURL(blob);
window.open(url);Decodifica un payload Base64 en crudo en un Blob y ábrelo. Para una URI de datos completa, la etiqueta <img> la acepta directamente.
Node.js
const fs = require('fs');
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
fs.writeFileSync('out.png', Buffer.from(b64, 'base64'));Una sola línea usando el Buffer integrado de Node para decodificar Base64 y escribir un archivo PNG.
Python
import base64
with open('out.png', 'wb') as f:
f.write(base64.b64decode('iVBORw0KGgoAAAANSUhEUg...'))Solo biblioteca estándar — decodifica texto Base64 de vuelta a bytes PNG.
PHP
<?php
file_put_contents('out.png', base64_decode('iVBORw0KGgoAAAANSUhEUg...'));Una sola línea usando los integrados base64_decode() y file_put_contents().
Shell (macOS / Linux)
echo 'iVBORw0KGgoAAAANSUhEUg...' | base64 -d > out.pngbase64 -d / -D de POSIX lee texto por stdin y escribe el PNG decodificado por stdout.
// FAQ — BASE64 A PNG
P: ¿Qué es la decodificación Base64 a PNG?
R: Revierte un PNG codificado en Base64 de vuelta a su forma binaria original. La cadena que pegas contiene 4 caracteres ASCII por cada 3 bytes binarios; el decodificador lee 4 caracteres a la vez, aplica la búsqueda en el alfabeto RFC 4648 y escribe 3 bytes por grupo hasta agotar la cadena. El array de bytes resultante es un archivo PNG completo y válido que puedes previsualizar, guardar o enviar a cualquier sitio donde se acepte un PNG normal.
P: ¿Cómo sé que la cadena Base64 es realmente un PNG?
R: Los primeros 8 bytes de cada PNG son la firma mágica 89 50 4E 47 0D 0A 1A 0A. Cuando se codifican en Base64, esos 8 bytes siempre empiezan por iVBORw0KGgo. Así que cualquier cadena Base64 que empiece por iVBORw0KGgo es un PNG. Otros formatos tienen prefijos distintos: /9j/ es JPEG, R0lGOD es GIF, UklGR es WebP. Nuestro decodificador detecta automáticamente los PNG por este prefijo mágico y recurre al tipo MIME presente en la URI de datos si está disponible.
P: ¿Puedo pegar una URI de datos o solo Base64 en crudo?
R: Ambos. Si tu cadena empieza por data:image/png;base64,, el decodificador elimina el prefijo automáticamente. Si pegas solo la parte del payload, inferimos el tipo MIME PNG a partir de los magic bytes. Los espacios, saltos de línea, retornos de carro y tabulaciones se normalizan antes de decodificar, así que puedes pegar una respuesta JSON con formato sin romper nada.
P: El PNG decodificado está roto — ¿por qué?
R: Causas habituales:
• Cadena truncada — el Base64 se cortó en algún sitio (p. ej., por un límite de salto de línea en el origen de copia). Un Base64 completo de PNG termina en RU5ErkJggg== (el chunk IEND); si falta, el archivo está incompleto.
• Alfabeto URL-safe — si la cadena usa -_ en lugar de +/ (base64url), nuestra herramienta lo normaliza; otros decodificadores pueden rechazarlo.
• Doble codificación — el PNG se codificó en Base64 dos veces. Decodifícalo de nuevo.
• No es un PNG — el payload es realmente JPEG o WebP. Usa nuestro decodificador genérico Base64 → Imagen, que detecta automáticamente cualquier formato.
P: ¿Decodificar de vuelta a PNG pierde calidad o transparencia?
R: No. Base64 es una transformación reversible bit a bit. El PNG decodificado es byte a byte idéntico al original: canal alfa, paleta (PLTE), transparencia (tRNS), perfil de color (iCCP/sRGB), gamma (gAMA) y dimensiones físicas en píxeles (pHYs) sobreviven todos. Un hash SHA-256 del archivo decodificado coincide con el hash del original. Si ves alguna diferencia, el cambio ocurrió antes de la codificación, no durante el round-trip de Base64.
P: ¿Puedo decodificar Base64 a PNG usando la terminal?
R: Sí. En macOS y Linux: echo 'iVBORw0KGgo…' | base64 -d > out.png
(macOS usa -D en versiones antiguas.)
En Windows PowerShell: [IO.File]::WriteAllBytes('out.png', [Convert]::FromBase64String('iVBORw0KGgo…'))
Si la cadena es una URI de datos completa, quita primero el prefijo data:image/png;base64, (la mayoría de las shells aceptan sed 's|^data:.*base64,||').
P: ¿De qué tamaño puede ser la entrada Base64 del PNG?
R: Decodificamos en el navegador, así que el límite es la memoria de tu dispositivo — cómodamente 100 MB+ en escritorio. Un PNG decodificado de 100 MB necesitaría ~135 MB de texto Base64, que la mayoría de los navegadores pegan sin quejarse. Si trabajas con PNG científicos o médicos muy grandes, considera la decodificación del lado del servidor, porque el rendimiento del atob() del navegador se degrada cerca del techo de memoria.
P: ¿Funciona este decodificador offline?
R: Sí. Toda la decodificación usa APIs nativas atob() + Uint8Array + Blob, integradas en todos los navegadores modernos. Tras cargar la página una vez, puedes desconectarte de la red y seguir decodificando. Sin servicios externos, sin viaje al servidor, sin analítica sobre tu payload de imagen.
P: ¿Cuál es la diferencia entre un PNG Base64 y un archivo PNG normal?
R: Contienen exactamente los mismos bytes. Un archivo .png normal es el binario en crudo; una cadena Base64 de PNG es ese mismo binario reescrito en el alfabeto ASCII de 64 caracteres. La forma Base64 es un 33 % más grande pero se puede soltar con seguridad en atributos HTML, cadenas JSON, url()s de CSS y correos. No puedes poner bytes PNG en crudo en HTML — contienen bytes nulos y caracteres de bit alto que rompen los parsers de texto. Base64 es el workaround.
P: ¿Un PNG Base64 carga más rápido que un archivo .png aparte?
R: Solo para imágenes minúsculas. Base64 ahorra un viaje HTTP, que puede ser de 50–100 ms en una conexión nueva — útil para iconos de UI críticos de menos de 4 KB. Para cualquier cosa más grande, un archivo .png aparte servido con cabeceras de caché de larga duración casi siempre gana porque (a) gzip comprime mal el texto Base64, (b) las URIs de datos no pueden cachearse de forma independiente y (c) bloquean el parseo del HTML. Usa Base64 para micro-assets above-the-fold, no para imágenes hero.
P: ¿Puedo decodificar Base64 a PNG sin subir los datos a ningún sitio?
R: Sí — esta herramienta se ejecuta 100 % en el cliente. Tu cadena Base64 se decodifica en JavaScript en tu dispositivo, se envuelve localmente en un Blob y se muestra mediante URL.createObjectURL(). No se sube nada. Puedes verificarlo abriendo la pestaña Red de las DevTools del navegador mientras decodificas — no sale ninguna petición. Ejecutar todo el flujo offline (modo avión) también funciona tras la carga inicial de la página.
P: ¿Cómo decodifico Base64 a PNG en código de producción?
R: En Node.js: fs.writeFileSync('out.png', Buffer.from(b64, 'base64')). En Python: open('out.png','wb').write(base64.b64decode(b64)). En Go: b, _ := base64.StdEncoding.DecodeString(b64); os.WriteFile("out.png", b, 0644). En Java: Files.write(Path.of("out.png"), Base64.getDecoder().decode(b64)). En Rust: std::fs::write("out.png", base64::decode(b64)?)?. En PHP: file_put_contents('out.png', base64_decode($b64)). La biblioteca estándar de cada runtime trae un decodificador Base64 — rara vez necesitas una dependencia externa.
P: Base64 a PNG vs Base64 a JPG — ¿qué decodificador debería usar?
R: Usa Base64 → PNG cuando la cadena Base64 empiece por iVBORw0KGgo (o la URI de datos diga data:image/png;base64,). Usa Base64 → JPG cuando la cadena empiece por /9j/4AAQ o /9j/2wC. Si no estás seguro, usa nuestro decodificador genérico Base64 → Imagen que inspecciona los magic bytes y elige automáticamente el formato correcto. Nunca fuerces un formato que no coincida con el payload — el archivo decodificado tendrá bytes válidos pero será ilegible.