跳到主内容
UniKit

图片格式转换

在浏览器本地把图片转成 PNG / JPEG / WebP:JPEG 与 WebP 可调质量,逐张对比输出尺寸与体积,支持多选批量转换后分别下载。

浏览器本地运行所有计算都在你的浏览器里完成,数据不会离开本机。

全部在浏览器本地转换,图片不会上传

还没有选择图片
转换结果

点击「开始转换」后,这里会显示每个文件的输出名称、尺寸与体积对比。

这个工具能做什么

  • 把 PNG 转成 JPEG 或 WebP 压体积:拖入文件、选目标格式调质量,逐张看到输出名称、尺寸与「体积缩小 / 变大」的百分比。
  • 统一素材格式:把一批混杂的图片(截图、导出图、手机照片)批量转成同一种格式再上传到 CMS 或 CDN。
  • 检查透明通道问题:图片含透明像素又选了 JPEG 时,工具会提示透明区域将被填充成白色,避免导出后才发现背景变白。
  • 评估 WebP 到底能省多少:同一张图分别转 PNG、JPEG、WebP,对比输出字节数再决定采用哪种。

示例

输入

photo.png(1000 字节)转成 JPEG,输出 375 字节

输出

photo.png → photo.jpg
1920 × 1080 · 1.0 KB → 375 B (-62.5%)

体积对比文字与 -62.5% 这个百分比来自纯逻辑函数:formatBytes 按 1000 进制换算,compareSizes 计算 (输出 - 原图) / 原图。真正的解码与编码用浏览器 canvas,无法在命令行离线验证,因此示例只展示确定的命名与体积对比结果。

常见问题

质量滑杆对 PNG 有效吗?

无效。PNG 是无损格式,浏览器 canvas 的 quality 参数对它不起作用,所以滑杆只影响 JPEG 与 WebP。想压 PNG 体积,可以先试着转成 WebP(同样支持透明通道,通常小很多)。

转成 JPEG 后透明背景变白了怎么办?

这是 JPEG 格式本身不支持透明通道,浏览器只能把透明区域画成白色。需要保留透明请选 PNG 或 WebP;如果目标平台只收 JPEG,就接受白底,或者先在原图里把背景做成实色。

为什么转换后文件反而变大了?

三种常见原因:把已经很小的 JPEG 再转成 PNG(无损),把高质量 WebP 转成低质量 JPEG 但内容本身是照片,或者原图来自截图这类大面积纯色(PNG 反而更省)。工具会明确标出「体积变大 +xx%」,看到这个就换格式或调质量重试。

分辨率会变吗?

不会。转换只改编码格式,像素尺寸与原图一致(输出尺寸会显示出来供核对)。需要改尺寸请用图片缩放工具,先缩放再转格式体积会更小。

图片会上传吗?

不会。文件通过 File API 在本地读取,用 createImageBitmap 解码、canvas.toBlob 编码,全程在浏览器内存里完成,没有上传接口。

关键词:图片格式转换png 转 jpgwebp 转换image converter图片压缩jpeg qualitybatch convertcanvas透明通道

同类工具