无需登录 数据私有 本地保存

图片生成HTML色表 - 列出所有用到的颜色

15
0
0
0
上传图片

拖拽图片到此处

或点击上传 · 支持 JPG / PNG / WebP

提取设置
粗量化(少色)精细(多色)
10300
导出色表
颜色列表
请上传图片开始分析

上传一张图片，自动提取所有颜色

常见问题
工具使用HTML5 Canvas读取图片的每个像素。为了高效处理，先对图片进行适度缩放（最大宽度400px），然后对RGB颜色进行通道量化——将相似的颜色合并。例如量化精度24级时，每个RGB通道被划分为24个级别，总共可表示24³=13,824种颜色。最后统计每种颜色的出现频率，按频率排序展示。
量化精度决定了颜色合并的精细程度。低精度（如8级）会将相似颜色大量合并，适合提取图片的主色调/调色板；高精度（如48级）保留更多颜色细节，适合分析颜色丰富的图片。对于logo、图标等颜色较少的图片，建议使用较高精度以保留所有颜色。
一张普通照片可能包含数万种不同的RGB值。为了实用性和可读性，工具会对颜色进行量化合并，将肉眼难以区分的相似颜色归为一类。另外，图片在Canvas中会被适度缩放（保留宽高比），这也会略微影响颜色统计。如果需要更精确的结果，可以提高量化精度。
支持所有主流浏览器可渲染的图片格式：JPG、PNG、WebP、GIF（静态帧）、BMP、SVG等。没有严格的文件大小限制，因为图片在分析前会被缩放到合理尺寸，处理速度很快。对于透明PNG，完全透明的像素会被自动忽略。
提供多种导出格式：全部HEX值（如#FF6B35）、全部RGB值（如rgb(255,107,53)）、CSS变量格式（--color-1: #FF6B35;）方便直接用于前端项目、JSON数组方便程序处理。也可以点击单个色块快速复制该颜色的HEX代码。
频率排序：按颜色在图片中出现的次数降序排列，最常用的颜色排在前面。色相排序：按HSL色彩空间中的色相角排列（红→橙→黄→绿→青→蓝→紫），适合查看颜色的色谱分布。亮度排序：按颜色的感知亮度从暗到亮排列，便于分析图片的明暗层次。
🔧 相关工具