> base64 | decode | PNG <
// 将 Base64 字符串与数据 URI 解码回 PNG 图片 — 保留透明度、即时预览、一键下载
解码后的 PNG 将显示在此
逐位完美
解码后的 PNG 与原文件逐字节相同 — alpha 通道、调色板与色彩配置全部完整往返。
本地解码
Base64 载荷在浏览器内使用 atob() 解码。无服务器上传，不会记录您的 PNG 字节。
实时预览
下载前即刻看到解码后的图片、尺寸和大致文件大小。
// 关于 BASE64 转 PNG
本工具接受的输入
- >数据 URI：data:image/png;base64,iVBORw0KGgo…
- >原始 PNG Base64 载荷（以 iVBORw0KGgo 开头）
- >含空白字符 / 换行的 Base64
- >标准 RFC 4648 字母表（+/，可选的 = 填充）
- >URL 安全 Base64（-_）— 解码时自动归一化
- >Unicode 感知粘贴 — BOM 会被剥离
常见使用场景
- >从 DOM 检查器的数据 URI 中保存截图
- >从数据 URI CSS 背景中提取 Logo
- >从 JSON API 响应中恢复图片
- >从数据库 TEXT 字段恢复图片
- >从邮件 MIME 部分恢复 PNG
- >检查内联 SVG 中嵌入的图标
- >调试损坏的 <img src="data:image/png;base64,…"> 标签
Base64 → PNG 解码原理
解码器会剥离任何数据 URI 前缀，对空白字符和 URL 安全字符进行归一化，然后调用 atob() 将每 4 个字符一组转换回 3 个二进制字节。字节数组会被封装进 MIME 类型为 image/png 的 Blob，分配一个对象 URL，并在 <img> 元素中渲染。由于 Base64 与二进制是双射的，输出与原始 PNG 逐位一致 — 解码文件的 SHA-256 与原始一致。
PNG 数据 URI 示例:
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==
性能与兼容性
- >解码在载荷长度上是 O(n) — 可处理 100 MB+ 无压力
- >使用浏览器原生 atob() — 没有笨重的 JS 补丁
- >在支持的查看器中支持多帧 APNG
- >在所有现代浏览器（Chrome、Firefox、Safari、Edge）中可用
- >移动端预览响应式，支持双指缩放
- >下载使用 Blob URL — 无需服务器往返
// 如何将 BASE64 解码为 PNG
步骤 1：粘贴
将 Base64 字符串或完整数据 URI 粘贴到输入框
步骤 2：解码
点击 [DECODE] — PNG 即刻在预览中渲染
步骤 3：检查
在保存前检查尺寸、文件大小与 alpha 通道
步骤 4：下载
点击 [DOWNLOAD .png] 将逐位一致的 PNG 保存到磁盘
// 代码示例 — BASE64 转 PNG
JavaScript（浏览器）
// 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);将原始 Base64 载荷解码为 Blob 并打开。若是完整数据 URI，可以直接作为 <img> 标签的 src。
Node.js
const fs = require('fs');
const b64 = 'iVBORw0KGgoAAAANSUhEUg...';
fs.writeFileSync('out.png', Buffer.from(b64, 'base64'));使用 Node 内置的 Buffer 将 Base64 解码为 PNG 文件的一行代码。
Python
import base64
with open('out.png', 'wb') as f:
f.write(base64.b64decode('iVBORw0KGgoAAAANSUhEUg...'))仅使用标准库 — 将 Base64 文本解码回 PNG 字节。
PHP
<?php
file_put_contents('out.png', base64_decode('iVBORw0KGgoAAAANSUhEUg...'));使用内置 base64_decode() 与 file_put_contents() 的一行代码。
Shell（macOS / Linux）
echo 'iVBORw0KGgoAAAANSUhEUg...' | base64 -d > out.pngPOSIX base64 -d / -D 从 stdin 读取文本并将解码后的 PNG 写入 stdout。
// 常见问题 — BASE64 转 PNG
Q: 什么是 Base64 转 PNG 解码？
A: 它将 Base64 编码的 PNG 还原为原始二进制形式。您粘贴的字符串是每 3 个二进制字节对应 4 个 ASCII 字符；解码器一次读取 4 个字符，按 RFC 4648 字母表查表，并每组写出 3 个字节，直到字符串耗尽。最终得到的字节数组是一个完整、有效的 PNG 文件，可用于预览、保存或在任何接受普通 PNG 的地方使用。
Q: 如何确认 Base64 字符串确实是 PNG？
A: 每个 PNG 的前 8 个字节都是魔数签名 89 50 4E 47 0D 0A 1A 0A。当这 8 个字节被 Base64 编码后，总会以 iVBORw0KGgo 开头。因此任何以 iVBORw0KGgo 起始的 Base64 字符串都是 PNG。其他格式的前缀不同：/9j/ 是 JPEG，R0lGOD 是 GIF，UklGR 是 WebP。我们的解码器会根据这个魔数前缀自动检测 PNG，若有则回退到数据 URI 中的 MIME 类型。
Q: 可以粘贴数据 URI，还是只能是原始 Base64？
A: 两者都可以。如果您的字符串以 data:image/png;base64, 开头，解码器会自动剥离前缀。如果您只粘贴载荷部分，我们会根据魔数字节推断出 PNG MIME 类型。解码前会归一化空白字符、换行符、回车符与制表符，因此可以直接粘贴格式化过的 JSON 响应而不破坏解码。
Q: 解码后的 PNG 损坏了 — 为什么？
A: 常见原因：
• 字符串被截断 — Base64 在某处被切断（例如复制源的换行长度限制）。完整的 PNG Base64 以 RU5ErkJggg== 结尾（IEND 数据块），若缺失则文件不完整。
• URL 安全字母表 — 如果字符串使用 -_ 而非 +/（base64url），本工具会自动归一化，但其他解码器可能拒绝。
• 双重编码 — PNG 被 Base64 编码了两次。请再解码一次。
• 根本不是 PNG — 载荷其实是 JPEG 或 WebP。请使用我们的 通用 Base64 → 图片解码器，它会自动识别任何格式。
Q: 解码回 PNG 会损失画质或透明度吗？
A: 不会。Base64 是逐位可逆的变换。解码后的 PNG 与原文件逐字节相同：alpha 通道、调色板（PLTE）、透明度（tRNS）、色彩配置（iCCP/sRGB）、gamma（gAMA）以及物理像素尺寸（pHYs）全部保留。解码文件的 SHA-256 哈希与原文件一致。如果您看到差异，那一定是发生在编码之前，而不是 Base64 往返过程中。
Q: 可以在终端中将 Base64 解码为 PNG 吗？
A: 可以。在 macOS 与 Linux 上： echo 'iVBORw0KGgo…' | base64 -d > out.png
（旧版 macOS 使用 -D。）
在 Windows PowerShell 上： [IO.File]::WriteAllBytes('out.png', [Convert]::FromBase64String('iVBORw0KGgo…'))
如果字符串是完整的数据 URI，请先去除 data:image/png;base64, 前缀（大多数 shell 接受 sed 's|^data:.*base64,||'）。
Q: Base64 PNG 输入能有多大？
A: 解码在浏览器内完成，所以上限是您设备的内存 — 桌面端可轻松处理 100 MB+。一张 100 MB 的解码 PNG 对应约 135 MB 的 Base64 文本，大多数浏览器都能粘贴而无抱怨。若处理非常大的科研或医学 PNG，建议改用服务端解码，因为浏览器 atob() 性能在接近内存上限时会下降。
Q: 该解码器能离线工作吗？
A: 可以。所有解码都使用原生 atob() + Uint8Array + Blob API，这些都是每个现代浏览器的内置 API。页面首次加载后，您可以断开网络继续解码。无外部服务、无服务器往返、不会对您的图像载荷进行任何埋点。
Q: Base64 PNG 与普通 PNG 文件有何区别？
A: 它们包含完全相同的字节。普通 .png 文件是原始二进制；Base64 PNG 字符串是同一份二进制用 64 个字符的 ASCII 字母表重写的结果。Base64 形式大 33%，但可以安全放入 HTML 属性、JSON 字符串、CSS url() 和邮件。您不能把原始 PNG 字节直接放进 HTML — 它们包含会破坏文本解析的空字节和高位字符。Base64 就是用来解决这个问题的。
Q: Base64 PNG 比单独的 .png 文件加载更快吗？
A: 只对很小的图片有利。Base64 可以省掉一次 HTTP 往返，在全新连接上能节省 50–100 ms — 对小于 4 KB 的关键 UI 图标很有用。再大一点，单独的 .png 文件配合长期缓存头几乎总是更优，因为：(a) gzip 对 Base64 文本压缩效果不佳，(b) 数据 URI 无法独立缓存，(c) 它会阻塞 HTML 解析。Base64 适用于首屏微小资源，而不是主视觉图。
Q: 我能在不上传数据的前提下将 Base64 解码为 PNG 吗？
A: 可以 — 本工具 100% 在客户端运行。您的 Base64 字符串在您设备上的 JavaScript 中解码，在本地封装为 Blob，并通过 URL.createObjectURL() 显示。没有任何上传。您可以在解码时打开浏览器开发者工具的网络面板进行验证 — 不会发出任何请求。在首屏加载完成后，整个流程也可以离线运行（飞行模式）。
Q: 如何在生产代码中将 Base64 解码为 PNG？
A: 在 Node.js：fs.writeFileSync('out.png', Buffer.from(b64, 'base64'))。在 Python：open('out.png','wb').write(base64.b64decode(b64))。在 Go：b, _ := base64.StdEncoding.DecodeString(b64); os.WriteFile("out.png", b, 0644)。在 Java：Files.write(Path.of("out.png"), Base64.getDecoder().decode(b64))。在 Rust：std::fs::write("out.png", base64::decode(b64)?)?。在 PHP：file_put_contents('out.png', base64_decode($b64))。几乎每种运行时的标准库都内置了 Base64 解码器 — 通常无需第三方依赖。
Q: Base64 转 PNG 与 Base64 转 JPG — 应该用哪个解码器？
A: 当 Base64 字符串以 iVBORw0KGgo 开头（或数据 URI 为 data:image/png;base64,）时使用 Base64 → PNG。当字符串以 /9j/4AAQ 或 /9j/2wC 开头时使用 Base64 → JPG。如果不确定，请使用我们的 通用 Base64 → 图片解码器，它会检查魔数字节并自动选择正确格式。切勿强制使用与载荷不符的格式 — 解码出的文件虽然字节有效，但无法读取。