跳到主要内容

设计 · 工具

提取图片颜色

在浏览器本地从图片中提取五个代表性色彩。

在浏览器本地运行。 你的输入不会上传或存储。你可以在浏览器的网络面板中验证这一点。

处理限制

  • 支持格式:jpeg, png, webp
  • 单个文件最大:25 MB
  • 图片最大像素数:40,000,000
  • 最多文件数:20
  • 批量总大小最大:100 MB

Canvas 输出可能会移除 EXIF 方向、相机信息等元数据。

这个工具解决什么问题?

批量选择图片后,工具会从每张图片中提取五个代表性色彩。你可以复制任意 HEX 值;该工具只输出颜色数据,不提供继续处理入口。

继续了解 压缩图片, 调整图片尺寸

应该从哪些示例开始?

提取照片色板

输入
Text
JPG · 2400 × 1600
输出
Text
#1E293B · #CBD5E1 · #F59E0B · #0F766E · #F8FAFC

检查设计资产

输入
Text
PNG · 透明背景
输出
Text
复制 HEX · 颜色数据结果

它是如何工作的?

浏览器会将图片绘制到较小的 Canvas,忽略接近透明的像素,再把相近的 RGB 值分到颜色桶中。

出现频率最高的五个颜色桶会转换为大写 HEX 值;这是代表性色板,不是色彩管理或无障碍审计。

有哪些边界和限制?

  • 支持 JPG、PNG 和 WebP,原始图片不会上传或存储。
  • 降采样可能忽略很小的细节,因此色板不一定包含每个可见强调色。
  • 透明像素会被忽略;有效内容很少的图片可能返回少于五种颜色。

技术参考

相关工具

  • 压缩图片为 JPG、PNG、WebP 输入比较 JPEG/PNG 压缩候选,查看文件大小与像素误差指标。
  • 调整图片尺寸在浏览器本地批量调整图片尺寸,并按需保持原始比例。
  • 转换图片格式在浏览器本地将图片转换为 JPG、PNG 或 WebP 格式。
  • 旋转和翻转图片在浏览器本地批量旋转和翻转图片。