色彩与像素

图像拾色器

从图像任意位置拾取颜色。

拖入图像以拾取颜色

支持 JPG、PNG、WebP、HEIC、TIFF 等 · 最大 40 MB MB

什么是 图像拾色器?

Pick colors from any point of an image。直接从任意图片像素采样精确的 HEX/RGB/HSL 颜色。从 Logo、参考图提取品牌色,做配色板。可复制的色值 + 可提取主色调色板。

所有处理均在浏览器本地完成,您的图片绝不会上传到任何服务器。

核心功能

  • 像素级放大镜头
  • HEX/RGB/HSL/HSV/CMYK 输出
  • k-means 聚类主色提取

常见使用场景

  • 从品牌Logo提取精确颜色值以保持设计一致性
  • 从参考图片取色构建调色板
  • 从截图采样hex/RGB/HSL值用于CSS开发
使用指南

如何使用此工具

图像取色器可以采样图片中任意像素的精确颜色,并同时以 HEX、RGB 和 HSL 三种格式呈现。设计师用它从灵感板中提取品牌色板;开发者用它把 CSS 值对齐到参考设计;内容创作者用它保持社交图片的品牌一致性。

如何使用

将图片拖入上传区。图片会渲染在交互式 canvas 中,悬停可查看坐标,点击即可采样。所取颜色会作为色块出现在旁边,同时显示 HEX、RGB 和 HSL 值。点击任意值即可复制到剪贴板。

每次取的颜色都会保存在下方的历史条中(最多 12 个最近取样),方便你在图中多处采样构建色板,而不会丢掉早先的样本。

  • 点击即可像素级精确取色
  • HEX、RGB、HSL 同时显示
  • 每个值都支持一键复制
  • 最多保留最近 12 个取样组成的色板历史

实际用途

在把 Figma 或手绘设计稿转成 CSS 时,直接从设计稿中取主色,比肉眼估算要精确得多。这样能消除“差一点”的手写颜色带来的违和感。

为社交动态构建色彩调性一致视觉的摄影师,可以从表现最好的一张照片中取 5 个色,作为后续帖子中文字、边框和背景的强调色,逐步建立统一的视觉识别。

常见问题

色彩管理吗?

数值从原始 sRGB Canvas 读取,不应用 ICC。

能取多个颜色吗?

Shift-点击可把多个颜色存进调色板。

显示哪些颜色格式?

同时显示HEX、RGB、HSL和HSV值,点击即可复制所需格式。

取色器准确度如何?

读取解码图像在当前缩放级别下的精确像素值。放大可获得边缘和渐变的亚像素精度。

可以保存调色板吗?

可以,点击的每种颜色都会添加到图片下方的调色板,可批量复制或导出为CSS变量。

这个工具免费吗?

是的,完全免费,无需注册、无水印、无每日限制。所有处理在浏览器本地运行。

取到的颜色是精确值吗?

在图片显示分辨率下是精确的。超大图片的显示可能被略微缩小,但颜色值依然准确。

能取一个区域并得到平均色吗?

暂不支持。可以多次取样后自行估算平均,或使用专门的色板提取工具。