图片对比工具

免费在线图片对比工具。支持并排、拖动滑块、洋葱皮叠加、逐像素高亮四种模式比较两张图片。完全在浏览器本地运行，不上传。

四种方式对比两张图片：并排、拖动滑块、洋葱皮叠加、逐像素高亮。 拖入两张图片，立刻看出改动之处。UI 回归、设计改稿、截图审查的利器。 🔒 完全在你的浏览器本地运行，图片不会上传到任何服务器。

拖入图片到此处，或点击选择
拖入图片到此处，或点击选择
在两侧各加载一张图片即可开始对比。

图片对比是如何工作的

四种对比方式

  • 并排对比 —— 最简单的检查：两张图原尺寸并列显示。
  • 滑块对比 —— 可拖动的分割线，一侧显示旧图、一侧显示新图，最适合 UI 改版前后对比。
  • 洋葱皮叠加 —— 将第二张图以可调透明度叠加在第一张上，便于发现位移和对齐偏差。
  • 像素高亮 —— 逐像素比较，将变化的像素标红，即使一个像素的改动也无所遁形。

像素对比的度量方式

像素高亮模式并非简单的 RGB 相减，而是采用 YIQ 色差 度量——与流行的 pixelmatch 库相同的思路。YIQ 将亮度（Y）与色度（I、Q）分离，更贴近人眼对差异的感知。一个 阈值 滑块控制差异多大才会标记一个像素。

常见场景

  1. UI 回归测试 —— 对比代码改动前后的截图。
  2. 设计走查 —— 核对开发实现是否与设计稿一致。
  3. 图片压缩质检 —— 精确查看编码器改动了哪些区域。
  4. 照片修图 —— 确认修图触及了哪些像素。

一切都在你浏览器的 Canvas API 上运行——不上传、不等待。

常见问题

我的图片会被上传到服务器吗？
不会。所有对比都通过 Canvas API 在你的浏览器本地完成，图片永远不会离开你的设备。
两张图片尺寸不同怎么办？
工具仍会对比，方式是对齐到左上角并使用较大的画布，同时会提示两张图的尺寸。若需要像素级精确结果，请使用相同尺寸的图片。
支持哪些格式？
浏览器能解码的都支持：PNG、JPG、WebP、GIF（首帧）、BMP、SVG。
阈值滑块有什么作用？
它设定两个像素相差多大才算作变化，采用 YIQ 色差度量。值越低越严格，值越高越能容忍细微色差。
如何保存像素对比结果？
切换到「像素高亮」模式，点击「下载差异图」即可把高亮结果导出为 PNG。