图片主色提取
本地运行,数据不上传服务器
拖拽图片到此处,或点击选择
支持 PNG、JPEG、WebP、GIF、BMP,最大 20 MB / 3200 万像素
使用说明
看到一张喜欢的海报或摄影作品,想借用它的配色做网页或 App 设计;做商品详情页时想分析主图的色彩分布,让配色更统一;做 UI 时从参考截图里取几个 HEX 值填到 CSS 里;做插画或海报前先分析一下参考图的色调比例。 这个工具从图片中提取 3 到 10 种近似主色,每种颜色显示 HEX、RGB 和估算占比。可以分别复制 HEX 或 RGB 值,直接用到 CSS 或设计工具里。基于颜色量化和加权中位切分算法,结果是接近人眼感知的近似配色方案。 透明像素和 Alpha 小于 32 的像素会被忽略,避免背景透明区域干扰分析。适合设计师、前端、做电商详情页、需要配色灵感的人。
核心功能
- ✓从图片中提取 3 到 10 种主色
- ✓显示每种颜色的 HEX、RGB 和估算占比
- ✓分别复制 HEX 或 RGB 值
- ✓忽略透明像素和接近透明的像素
- ✓使用颜色量化算法,接近人眼感知
- ✓本地分析,图片不上传服务器
- ✓适合做配色方案和视觉分析
使用教程
从海报提取配色:上传参考图,得到主要颜色和占比,作为项目配色的起点。 分析商品图色彩分布:看主图用了哪些主色,帮助详情页配色更协调。 取色填入 CSS:复制 HEX 值直接粘到样式表里,省去手工取色。 做 UI 参考色板:从截图里提取主色,快速生成项目的色板。 做插画前的配色分析:先分析参考图,再动手画。
常见问题
Q:提取的颜色准确吗?
A:结果是近似调色板,基于颜色量化算法,不提供精确到每个像素的统计。
Q:能区分背景、Logo、文字吗?
A:不能,工具只分析整体颜色分布,不做语义区域识别。
Q:可以提取多少个颜色?
A:3 到 10 个,按需设置。
Q:会忽略透明部分吗?
A:会,透明像素和 Alpha 小于 32 的像素在分析时被忽略。
Q:支持哪些图片格式?
A:支持 PNG、JPEG、WebP、GIF、BMP。
Q:图片会上传服务器吗?
A:不会,分析在浏览器本地完成。