免费调色板提取器
用这款免费调色板提取器，从 JPG、PNG 或 WebP 图片中提取 4、6、8 或 12 种颜色。可复制 HEX、RGB 或 HSL 色值，也可复制 CSS 变量。你的图片始终留在你的设备上。
将图片拖放到这里
或点击选择文件。支持 JPG、PNG 或 WebP
把图片变成可直接使用的调色板
选择 4、6、8 或 12 种颜色，在 HEX、RGB 和 HSL 之间切换，可复制单个色值，也可把整个调色板复制为 CSS 变量。
从图片中提取颜色
拖入照片、标志或截图，调色板就会自动出现。每个色块都是一组像素的平均颜色，通过中位切分法得出。
- 支持 JPG、PNG 和 WebP 图片
- 加载完成后立即显示调色板
- 可选 4、6、8 或 12 种颜色
复制 HEX、RGB 和 HSL 色值
一键即可把所有色块在 HEX、RGB 和 HSL 之间切换，再点按色块就能复制其色值。「CSS 变量」框包含完整的调色板，可直接用于样式表。
- HEX、RGB 或 HSL 色值
- 一键复制为 CSS 变量
- 命名为 --color-1 到 --color-12
自选调色板大小
用 4 种颜色得到精炼的品牌调色板，或选 6、8、12 种来查看更多色调。更改大小后调色板会立即更新，无需重新上传。
你的图片留在你的设备上
颜色在你的浏览器标签页内计算，图片绝不会发送给我们。我们只统计匿名使用数据，例如所选的调色板大小和耗时。
从透明标志中得到干净的调色板
透明度超过一半的像素会被跳过。PNG 标志或图标周围的空白区域不会给你的调色板带来多余的黑色或白色色块。
大图自动缩放后再分析
统计颜色之前，工具会把图片副本的最长边缩放到 256 像素。相机拍摄的大图与截图的处理方式相同，不过细小的细节会融入附近的颜色。
如何从图片中提取调色板
添加图片。
把一个 JPG、PNG 或 WebP 文件拖到框中，或点击选择文件。编辑器会打开，并立即生成 6 色调色板。
设置调色板大小。
在「调色板大小」下点击 4、6、8 或 12，改变得到的颜色数量。在「颜色格式」下选择 HEX、RGB 或 HSL。
复制你的颜色。
点击任意色块即可复制其色值，或点击「复制全部为 CSS 变量」获取整个调色板。再把它粘贴到你的样式表或设计应用中。
谁在使用调色板提取器
设计师、开发者和营销人员，需要从视觉素材中获取可用的色值。
UI 与网页设计
从客户的照片、设计稿或主视觉图中提取颜色，并粘贴为 CSS 变量。这样你就能得到一组与图像风格相符的设计令牌作为起点。
- 把主视觉图变成 --color-1 到 --color-N 变量
- 让按钮和链接的颜色与产品照片相匹配
- 复制 RGB 或 HSL 值，在代码中继续微调
标志与品牌套件
拖入 PNG 标志，即可得到其品牌色的 HEX 色值。透明区域会被跳过，所以调色板来自标志本身，而不是空白背景。
- 找出客户标志的 HEX 色值
- 让幻灯片和社交媒体帖子与品牌色保持一致
- 用产品照片搭建简单的品牌套件
艺术与插画
从参考照片、画作或情绪板中取样有限的调色板。用 4 或 6 种颜色让习作保持简洁，然后用这些色值来作画。
- 从参考照片中提取有限的调色板
- 从画作中取样颜色，用于色彩习作
- 为情绪板收集协调的配色组合
常见问题
关于从图片中提取调色板和 HEX 色值的解答。
如何从图片中提取调色板？
把 JPG、PNG 或 WebP 图片拖到本页面。编辑器会打开，图片加载完成后立即显示 6 色调色板。在「调色板大小」下更改数量，然后点击色块复制其色值。
如何从图片中获取十六进制色值？
上传图片，并保持「颜色格式」为默认的 HEX。每个色块都会显示一个六位代码，例如 #3a7bd5。点击色块即可复制该代码，或点击「复制全部为 CSS 变量」一次复制所有代码。
一张图片最多可以提取多少种颜色？
你可以选择 4、6、8 或 12 种颜色，默认是 6 种。4 种适合简洁的品牌调色板。数量越多，色块越多，但天空这类大面积区域往往会用相近的色调占据好几个色块。
工具是如何选择颜色的？
它使用中位切分法。图片副本会被缩放到最长边 256 像素，其像素按红、绿、蓝值被分成数量相等的若干组。每个色块是一组像素的平均值，所以可能是任何单个像素都不具备的混合色。选择 6 或 12 种颜色时，最浅的几组会被舍弃。
可以把调色板复制为 CSS 变量吗？
可以。「CSS 变量」框会把你的颜色列在 :root 块中，按 --color-1、--color-2 依次命名，格式与你选择的颜色格式一致。点击「复制全部为 CSS 变量」，再粘贴到样式表中即可。代码会复制到剪贴板，不会下载文件。
可以从 HEIC、GIF 或 SVG 文件中获取调色板吗？
不能直接获取。上传器只支持 JPG、PNG 和 WebP，HEIC、GIF、AVIF、SVG 和 TIFF 文件会被拒绝。如果是 HEIC 或 TIFF 照片，请先用免费的图片转换器把它转成 PNG，再把 PNG 拖到这里获取调色板。
支持透明背景的 PNG 标志吗？
支持。透明度超过一半的像素会被跳过，所以标志的空白背景不会带来黑色或白色色块。如果图片几乎完全透明，则不会显示任何色块，请试试把标志放在纯色底上的副本。
为什么图片中的某种颜色没有出现在调色板里？
有两个原因会让颜色消失。每个色块取的是等量像素的平均值，所以面积很小的点缀色会融入周围的颜色。选择 6 或 12 种颜色时，工具还会舍弃最后几组，这些组往往包含最浅的像素，因此白色区域可能会不见。选择 4 或 8 种颜色即可覆盖所有像素。
可以拾取图片中某一个点的颜色吗？
这个工具不行。它会为整张图片生成调色板，没有针对单个像素的取色器。如果想取样某个小区域，请先把图片裁剪到只剩那一处，调色板就只会来自剩下的部分。
可以从网站或网址提取调色板吗？
不能直接提取。这个工具读取的是图片文件，而不是网址。请先给网站截图，保存为 PNG，再拖到这里，就能得到页面的主要颜色，格式为 HEX、RGB 或 HSL 色值。
这个调色板提取器免费且注重隐私吗？
是的。它免费，无需注册，也没有每日次数限制。你的图片只在浏览器内读取，绝不会发送到我们的服务器。我们只记录匿名统计数据，例如调色板大小和耗时，绝不会记录图片或其中的颜色。