抠图后下载的 PNG 是「透明」的。但「透明」到底是什么？为什么 JPG 不能透明？为什么有的 PNG 文件 100KB，有的 5MB？
这篇把透明 PNG 的底层讲清楚 —— 看完你能判断什么时候用 PNG、什么时候应该换 JPG / WebP。
一、像素的本质：4 个数字
屏幕上一个像素，本质是 RGB 三个颜色值。
- 红 (R)：0-255
- 绿 (G)：0-255
- 蓝 (B)：0-255
JPG / 普通图像 = 每像素 3 个数字。
透明 PNG 多了第 4 个数字：alpha (A)。
- alpha 0 = 完全透明（这个像素看不见）
- alpha 255 = 完全不透明（正常像素）
- alpha 128 = 半透明（50% 跟下层颜色混合）
所以透明 PNG 每像素 = 4 个数字 (RGBA)。
二、alpha 通道是什么
「alpha 通道」就是上面那个 alpha 值。
可以想象成：图片除了 RGB 三层外，还附带一张黑白「透明度地图」。
- 地图上黑色 (0) 的像素 → 完全透明
- 地图上白色 (255) 的像素 → 完全不透明
- 地图上灰色 (128) 的像素 → 半透明
抠图工具的输出就是：保留原图 RGB + 计算出一张 alpha 地图。背景部分 alpha = 0（透明），主体 alpha = 255（保留）。边缘有过渡（alpha 50-200）让发丝、纱裙自然融入新背景。
三、PNG-8 vs PNG-24 / 32 区别
PNG-8（"老 PNG"）
- 8 位调色板 + 1 位 alpha（只能完全透明或完全不透明）
- 体积小（几十 KB）
- 不支持半透明 —— 边缘锯齿明显，发丝抠不出渐变
- 适合：图标、Logo、简单矢量插画
PNG-24 / 32（"现代 PNG"）
- 24 位 RGB + 8 位 alpha（256 级透明度）
- 体积大（几百 KB - 几 MB）
- 支持完整半透明 —— 平滑边缘、玻璃、烟雾
- 适合：抠图结果、需要平滑融入背景的素材
严格说 PNG-24 是 RGB 24 位（不含 alpha），PNG-32 是 RGBA 32 位。日常说 "24 位 PNG" 通常已包含 alpha，跟 PNG-32 混用，意思都是「现代 PNG」。
幻图妙盒去背景后输出的是 PNG-32（带 8 位 alpha 通道）—— 边缘有 256 级过渡，发丝 / 纱裙 / 烟雾才能自然融入新背景。
四、Premultiplied vs Straight alpha
进阶概念，但跟使用质量直接相关。
Straight alpha（直接 alpha，PNG 默认）
- 颜色值跟 alpha 独立存储
- 一个完全透明的像素 (R=255, G=0, B=0, A=0)，颜色仍是红色但透明
- 跨软件兼容性好 —— PNG 标准格式
- 缺点：合成时需要先乘以 alpha 再叠加，慢
Premultiplied alpha（预乘 alpha，AE / Photoshop 内部）
- 存储的颜色值 = 实际颜色 × alpha
- 完全透明像素 = (R=0, G=0, B=0, A=0) —— 颜色已经被 alpha 抹掉
- 合成快 —— 直接相加即可
- 缺点：兼容性差，跨软件转换易出问题
日常用户不用管 premultiplied。除非你做特效合成 / 游戏开发，否则 PNG-32 straight alpha 就够。
五、PNG / JPG / WebP 根本区别
| 项 | PNG-32 | JPG | WebP |
|---|---|---|---|
| 透明支持 | ✅ 完整 256 级 | ❌ 完全没有 | ✅ 完整 |
| 压缩 | 无损 | 有损 | 二者皆有 |
| 体积 | 大（无损 + alpha） | 最小 | 中等 |
| 色彩深度 | 24 位 | 24 位 | 24 位 + alpha |
| 适合 | 抠图、Logo、需要透明 | 照片、最终发布 | 全场景，体积优先 |
| 不适合 | 高分辨率连续色 | 任何透明素材 | 老浏览器 |
3 个决策铁律：
- 需要透明 → PNG（或 WebP，如果都是新浏览器）
- 不要透明 + 内容是连续色（照片）→ JPG，体积省 5-10 倍
- 想都要 → WebP，但确认目标设备支持（iOS 14+、所有主流浏览器都支持）
六、5 个真实用法
用法 1 · 抠图后换背景
用法 2 · Logo / 图标 → 嵌入网页或文档
- 输出：PNG-32（高质量）或 SVG（矢量更好）
- 浏览器、PowerPoint、Word 都直接支持
用法 3 · 商品图准备双底色版本
- 主体抠成 PNG-32 → 一次抠图，可换任意底色
- 比每个底色单独拍一遍省 10 倍时间
用法 4 · 设计师二创素材
- 输出：PNG-32 高分辨率（1500px+ 短边）
- 给到设计师后续合成 / 二创时，alpha 通道是必须的
用法 5 · 印刷品 / 名片 logo 嵌入
- 输出：PNG-32 高分辨率（300 DPI）
- 印刷店打开后能保留透明，避免出现白色矩形底
七、为什么 JPG 不能透明
JPG 是 1992 年设计的，底层只存 RGB，没有第 4 个通道。
而且 JPG 用有损压缩，把图片切成 8×8 块离散余弦变换 + 量化。如果硬塞 alpha 通道，压缩算法会让 alpha 边缘出现「振铃伪影」（ringing），透明度不准。
所以 JPG 永远做不到透明。想要透明，必须换 PNG / WebP / TIFF / SVG。
八、3 个常见误区
误区 1 · "把 JPG 改成 .png 后缀就透明了"
不行。后缀是文件名约定，不改变文件内容。JPG 文件改后缀只是文件名长得像 PNG，里面还是 JPG 数据，依然没透明。
怎么真正转换：用 图片格式转换 类工具读 JPG 解码 → 重新以 PNG 格式编码。
误区 2 · "透明 PNG 一定比 JPG 大"
不一定。取决于内容：
- 简单 Logo（少量颜色 + 透明）→ PNG-8 50KB，JPG 100KB
- 高分照片（连续色 + 不透明）→ PNG-24 5MB，JPG 500KB
照片用 JPG 永远比 PNG 小，因为有损压缩。
误区 3 · "WebP 完全替代 PNG"
WebP 优势：体积小 + 支持 alpha。但有 2 个缺点：
- 老设备不支持：iOS 13 以下、Windows 系统照片预览
- AE / Photoshop 工作流较差：少数老版本不支持
给最终用户的图用 WebP 没问题（移动浏览器 / 现代电脑全支持）。给设计师 / 印刷店的源文件用 PNG。
一句话总结
PNG-32 的 alpha 通道是抠图换背景的基础。要透明 = PNG；要小 = JPG / WebP。这就是全部决策。
立即试试：
- 👉 去背景工具 —— 输出 PNG-32（带 alpha 通道）
- 👉 换背景工具 —— PNG-32 + 任意底色合成
- 👉 图片格式 deep dive —— PNG vs JPG vs WebP 实测对比
相关阅读：