WebP 转 PNG — 无损保存解码像素与透明通道,适合修图中间稿、图标素材与长期存档,本地处理不上传
WebP 转 PNG 面向的是还要继续用这张图的人,而不是只想快点发出去的人。WebP 为网页体积而生,有损模式解码拿到的都是量化过的像素,再存成 JPG 还要再损一次;PNG 则把每个像素原样写下来,不丢细节、支持完整的 alpha 通道。把站点里的 WebP 图标、圆角按钮、抠好的产品图或透明底标志转成 PNG,等于在浏览器里解码一次后不再压缩地封存,后续调色、抠图、叠图层或反复另存都不会越存越糊。代价是体积明显变大,一张照片常有几 MB,放上网页前最好再压一次。支持一次导入多张,批量列表逐张显示尺寸与体积,预览区用上一个、下一个切换,左边原图、右边 PNG 结果并排核对边缘与渐变。下拉随时能改成 JPG,已解码的图片会自动重新导出,不用重传。解码走浏览器原生能力,全程不上传,断网也能用;生成的是干净文件,容器里的 EXIF、ICC 与方向信息不会自动带过去。PNG 也不带动画,多帧 WebP 只会取第一帧,批量列表里还能单独重试或只挑几张下载。
导入图片
目标格式
两种格式共用同一份解码结果,切换后会自动重新导出,不用重新导入图片。
PNG 无损保存每个像素并保留透明通道,适合继续修图、做素材或存档,体积通常最大。
PNG 是无损格式,不需要设置压缩质量。
少数 WebP 带方向标记或取自竖拍素材,解码后横着显示时用这里手动校正。
留空即用原文件名,导出时自动换成对应的扩展名。
预览与导出
批量列表
0 / 0 已完成还没有导入图片。
操作说明
- 把 .webp 图标、截图或带透明区域的素材拖进导入区,一次可挑多张,按 Ctrl+V 也能粘贴。工具按文件头识别真实格式,扩展名写错不影响判断。
- 目标格式保持 PNG,此时不需要调质量滑块,因为输出走的是无损编码;先看预览里左右两幅画面的边缘与渐变是否一致。
- 打开棋盘格开关核对透明区域是否完整保留;少数 WebP 带方向标记,解码后横着显示时用额外旋转校正。
- 用预览区的上一个、下一个逐张比对,确认后下载当前,或在批量列表里逐张下载、打包 ZIP。想换成 JPG 直接改下拉,已解码的图片会自动重新导出。
常见问题解答
WebP 本身不是有无损模式吗,为什么还要转 PNG?
有,但网页拿不到它。canvas 的 toBlob 只暴露 PNG 的无损导出,libwebp 那套独立的无损编码需要专门的编译版本才能在页面里调用;更现实的区别是生态,几乎所有设计软件、剪辑时间线、打印流程和归档系统都能直接读 PNG,而带无损数据的 WebP 在很多工具里仍会被当成普通有损图处理。转出来的是一份谁都能打开的母版。
转成 PNG 能把压缩掉的细节找回来吗?
不能。无损说的是从这一步起不再继续损失,不是把过去丢掉的信息还原。有损 WebP 解码后天空里已有的色块、发丝旁已有的振铃都会原样留在 PNG 里,只是后续再怎么另存、调色、叠图层都不会雪上加霜。要真正拿回细节,只能去找相机原片、原始设计稿或未压缩的归档文件。
透明通道会完整保留吗?
会。PNG 支持完整的八位 alpha 通道,半透明阴影、羽化边缘和圆角外侧都会按原样写进新文件,不会像 JPG 那样被合成到某个底色上。预览区可以打开棋盘格开关,方便看清楚哪些地方是真的透明;贴到深色页面之前,建议先在这里确认边缘没有残留的白边或脏色。
为什么文件变大了这么多,还能放上网页吗?
因为 PNG 用 Deflate 做无损压缩,擅长图标、线稿和大片纯色,遇到照片里的连续色调就远不如帧内预测省空间,一张手机照片常有几 MB。这一页的定位是中间稿与归档,不是上线素材;要放上网页,请从这份干净的母版重新导出一份压缩过的 WebP 或 JPG,别把存档文件直接传上去。
导出后颜色或方向和原图不一样怎么办?
转换生成的是一份全新文件,WebP 容器里的 EXIF、ICC 色彩配置和方向标记不会自动带过去,某些带广色域配置或方向属性的素材在别的软件里看起来会略有差异。先用预览区左右并排核对,方向不对就在额外旋转里选九十度或一百八十度;如果色彩差异明显,请在最终使用的软件里指定正确的色彩配置。
概念
这一对格式的分歧在「有没有再丢一次」。WebP 的有损模式用帧内预测加变换量化换取体积,解码得到的像素已经不是相机或设计稿里的原始数值;即使源文件用的是 WebP 无损模式,浏览器交给 canvas 的也只是解码后那版八位像素。PNG 走的是另一条路:它把每一行像素先做预测滤波,再用 Deflate 做无损压缩,解出来和写进去完全一致,还支持八位或十六位色深、灰度、调色板与完整的 alpha 通道。所以转 PNG 的意义不是让画面变好看,而是给解码后的像素找一个稳定、谁都能打开的落脚点,后面的每一次编辑都从同一份底稿出发。需要说清楚的是,无损指的是「从现在起不再损失」,它无法把有损 WebP 第一次压缩丢掉的信息变回来,天空里已有的色块依旧在。网页里 canvas 的 toBlob 只暴露 PNG 的无损导出,拿不到 libwebp 那套独立的无损编码,所以想要真正可长期编辑的母版,PNG 仍是更直接的选择;APNG 虽能带动画,却不是这里输出的目标。工具按文件头识别真实格式,扩展名写错不影响判断。
历史与由来
这段历史里没有新算法,只有两次关于「授权」与「体积」的选择在二十年后撞到一起。第一次选择在一九九四年:Unisys 开始对 GIF 的 LZW 压缩主张专利费,网页社区突然发现最通用的无损图片格式可能要收费。托马斯·布特尔在邮件列表里发起讨论,一批工程师用几周时间拼出替代规范:采用当时已经公开的 Deflate,加入完整的 alpha 通道、伽马校正和循环冗余校验,一九九六年成为 W3C 推荐标准,二〇〇三年又成为 ISO/IEC 15948。名字 PNG 流传最广的解释是递归缩写,带着一点自嘲;此后它稳稳占住图标、截图、线稿和修图中间稿,libpng 几乎被嵌进每一套图像工具链,APNG 后来补上动画,主体规范三十年没大变。第二次选择要等到二〇一〇年:谷歌以收购来的 VP8 帧内编码为蓝本发布 WebP,用 RIFF 容器装下有损图像,随后补上 alpha、无损编码与动画,目标很明确,让网页少传字节。Chrome 早早支持,火狐到二〇一九年跟上,Safari 直到二〇二〇年才补齐,中间那些年前端要为每个页面维护两份素材。等到主流浏览器都能原生解码 WebP,新的缝隙显现出来:站点目录里堆满了压过的 .webp,而设计软件、打印流程和归档系统期待的仍是一份谁都能无损读进去的母版。补齐它的不是新标准,而是早就存在的两件东西:浏览器把 WebP 解成像素,canvas 用 toBlob 把这些像素无损写成 PNG,本地解码加本地导出连上传接口都不必存在。今天点一下就能转换,看似只是换了个后缀,实质是把一份为传输而生的文件,重新安放成适合长期保存的底稿;后来 AVIF 与 JPEG XL 又推过压缩率,新格式更需要回到底稿。
相关关键词
纠错反馈
如果发现工具问题或有任何建议,欢迎通过邮箱联系我们,我们会认真查看每一条反馈。
