调色板提取器

从任意图片提取调色板

上传照片即可提取主色调,选取精确像素颜色,并导出可直接使用的代码。

将图片拖放到此处

或点击浏览文件

支持 PNG、JPG 和 WebP,最大 50MB

分享

关于调色板提取器

此工具会分析图片的像素,并使用中位切分量化(median-cut)算法——经典减色算法中使用的同一技术——将它们归并为少量具有代表性的颜色。选择调色板大小,点击任意色块即可复制其十六进制颜色代码,或使用取色器从照片中选取精确的像素颜色。

功能:

  • 支持 4、6 或 8 种颜色的中位切分调色板提取
  • 可从图片中选取精确像素颜色的取色器工具
  • 一键复制十六进制和 RGB 颜色值
  • 支持导出为 CSS 自定义属性、JSON 或 Tailwind 配置代码

如何提取调色板

  1. 上传或拖入图片(PNG、JPG 或 WebP)
  2. 选择调色板大小:4、6 或 8 种颜色
  3. 点击色块复制十六进制代码,或点击图片选取精确像素颜色
  4. 复制 CSS、JSON 或 Tailwind 导出代码用于你的项目

常见问题

调色板提取器是如何工作的?

它会对图片进行降采样,读取像素颜色,并使用中位切分量化算法将相近的颜色归为一组。每组颜色取平均值得到一个代表性色块,色块再按其在图片中所占比例排序。

上传的图片大小有限制吗?

支持最大 50MB 的图片。非常大的图片会在分析前自动降采样,因此无论原始分辨率如何,提取速度都很快。

取色器工具有什么用?

在已上传的图片上任意位置点击,即可选取该像素的精确颜色,这与自动提取的调色板相互独立。你最多可以用这种方式选取 6 种颜色。

为什么提取出的颜色和照片里看到的不完全一致?

调色板是通过对相近像素分组取平均值生成的,因此细微的渐变和阴影会被平滑归并为少量代表性色块,而不是保留每一个具体色调。如果需要精确的像素颜色,请使用取色器。

上传图片会被发送到其他地方吗?

不会。解码、降采样、颜色分析等每一步都在你的浏览器本地完成,图片绝不会被上传或存储。

如何在我的网站或设计工具中使用这个调色板?

使用导出面板,可以将调色板复制为 CSS 自定义属性、十六进制代码的 JSON 数组,或可直接粘贴使用的 Tailwind 配置代码片段,然后直接放入你的项目。

隐私

你的图片完全在浏览器中使用 canvas 像素数据处理,绝不会上传到服务器。

标准与参考资料

最后更新: 2026-07-22