图片颜色提取 / 在线取色器（调色板生成）

图片颜色提取 / 在线取色器：生成可用调色板

这个工具用于从一张图片中提取主要颜色：上传后自动完成分析，得到按画面占比排序的调色板，并把每个颜色换算成 HEX、RGB、HSL、CMYK 等常用格式，点击即可复制。做 UI 配色、网页主题色、PPT 配色或设计参考时，可以直接在成品图上取色，而不需要借助专业设计软件。

核心功能

• 上传即分析：拖入或选择图片后自动完成一次颜色分析，无需手动触发。
• 主色与调色板：占比最高的颜色单独用大色块展示，其余颜色以色块列表排列，每个色块标注 HEX 值与占比。
• 颜色详情：选中任意色块可查看该颜色的 HEX、RGB、HSL、CMYK 完整数值与画面占比，每行都有独立的复制按钮。
• 批量复制：可一键复制全部颜色的 HEX 清单，或复制成 CSS 变量形式，直接带入样式表、设计规范或配色文档。
• 图片取色：在图片上移动鼠标或手指即可实时读取任意位置的颜色，点击即复制 HEX 值，适合在渐变、阴影等过渡区域精确取色。

颜色数量与结果排序

颜色数量提供 5 色、10 色、20 色三档：5 色适合快速抓住主色调，10 色适合生成配色方案，20 色适合分析插画、渐变等色彩构成复杂的图片。切换数量后会立即按新数量重新计算，结果按占比从高到低排列。分析采用直方图与中位切分算法，把相近颜色按像素占比合并成代表色；为兼顾准确与速度，分析会在图片的缩小副本上进行，因此超大图片也不会卡顿。

色值格式说明

• HEX：十六进制写法，网页与 CSS 中最常用。
• RGB：红绿蓝三通道数值，适合绝大多数前端与设计工具。
• HSL：色相、饱和度、亮度，便于手动调整明暗与配色。
• CMYK：四色百分比，用于印刷配色参考。
• CSS：可直接粘贴使用的 rgb 函数写法。

几种格式由同一颜色实时换算，保证数值一致，复制后即可在对应工具中直接使用。每个颜色还会附带一个就近的颜色名（如红色、蓝色、青色），便于快速识别。

影响结果的提示

图片含透明区域时，完全透明的像素不参与颜色统计，占比按不透明区域计算，页面会给出提示；GIF 动画只分析第一帧；当原图较大时，会先缩放再分析，页面会说明缩放到的最大边长，颜色结果不受影响。这些提示能帮助判断结果是否与预期一致。

异常情况处理

不支持或非图片文件会被过滤并提示具体原因；图片解码失败时会给出错误说明并在状态栏提示，不会停留在空白结果；分析模块加载失败会提示刷新重试。所有提示都在页面内显示，便于快速定位问题。

使用场景与隐私

适合 UI 与网页设计提取主题色、演示文稿与海报统一配色、印刷前参考 CMYK 数值、观察优秀作品的色彩构成等场景。颜色分析与取色全部在浏览器本地完成，页面没有上传接口，图片不会上传服务器，也不会被保存，可以放心用于未发布的素材与内部设计稿。