工作原理
选择一张照片、标志或截图,工具会用中位切分算法 (median cut) 找出其中的主要颜色:该算法反复把图片中的颜色分成数量相等的若干组。每种颜色都会显示 HEX 代码及其在图片中所占的比例,整套配色还可以复制为 CSS 变量。
图片 → 按相似度分组颜色 → 取每组的平均色
适用场景
- 从产品照片中提取品牌或网站配色。
- 让幻灯片、海报或缩略图的颜色与图片相匹配。
- 找出标志或插画的准确颜色。
使用提示
- 颜色数量少时显示主色调,数量多时还能找出点缀色。
- PNG 图片中的透明区域会被忽略。
- 图片在您的设备上分析,绝不会上传。
标准与出处
- 颜色量化采用中位切分算法 (median cut, Heckbert, 1982)
- 颜色以 CSS Color Module Level 4 定义的 sRGB 表示
最后核对于 2026年10月7日
常见问题
主要颜色是怎样选出来的?
中位切分算法反复把图片中的颜色分组,并取每组的平均色,因此出现较多的颜色会凸显出来。
应该提取多少种颜色?
四到六种可以体现整体氛围;八到十二种还能捕捉较小的点缀色。
适用于标志和截图吗?
适用。纯色平面图像能得到非常准确的颜色,PNG 的透明区域会被忽略。
我的图片会被上传吗?
不会。图片在您的浏览器中缩小并分析,绝不会离开您的设备。
可以在 CSS 中使用这些颜色吗?
可以。复制 CSS 变量代码块,或点击某个颜色复制其 HEX 代码。