图片取色板

从图片里提取主色,自动生成明暗色阶,导出 CSS 变量、Tailwind 颜色或 JSON,图片本地处理。

图片与色数

取色在本地完成,图片不会上传

提取结果

点色卡复制 HEX

主色明暗阶

从图片里「取色」到底在取什么

主色不是简单的平均色 —— 整张图平均下来通常是一片灰。这里把像素按 4 位量化成 4096 个颜色桶,统计每个桶的占比,再按占比排序、按色彩距离去重,得到的是「人眼看到的那几种颜色」。

占比最高的一色适合做主色,第二三色适合做强调色。明暗阶用主色与黑/白混合生成,正好够搭一套按钮的 hover、active、disabled。