图片主色调提取

📖 工具介绍

上传任意图片，工具会用中位切分算法对像素颜色聚类，提取指定数量（2–24）的主色，并按占总像素的比例从高到低排列。每种颜色同时给出 HEX、RGB、HSL 三种表示，点击色块即可复制。可一键复制全部颜色值，或导出为 CSS 自定义变量文件直接用于前端项目。采样间隔用于平衡速度与精度，值越大越快。全部处理在本地完成。常见使用场景包括：设计师从参考图里取色搭建配色方案，前端工程师为网站生成主题色变量，运营人员为海报提取品牌主色，以及对比多张图片的色调差异。提取结果按占比排序，排在第一位的通常是画面底色或主色。若想突出画面中的点缀色，可以把颜色数调大一些再从中挑选。导出的 CSS 变量文件可直接复制进样式表使用。

✨ 功能特点

• 中位切分聚类：经典颜色量化算法，主色提取比简单平均准确得多
• 占比排序：按颜色占画面比例从高到低排列，主次一目了然
• 三种色值格式：HEX / RGB / HSL 一键切换，点击色块即可复制
• CSS 变量导出：导出为 CSS 自定义属性文件，可直接用于前端项目
• 可调采样精度：采样间隔越大越快，需要精细结果时调小即可

🚀 使用方法

1. 1. 上传图片；
2. 2. 设置颜色数量与显示格式；
3. 3. 点击「提取主色」；
4. 4. 点击色块复制或下载 CSS 变量。