图片颜色分析

图片取色器

点击或触摸图片取色,查看原图坐标、透明度与常用颜色代码。

图片仅在您的浏览器中处理,不会上传到服务器。

这个工具是什么

图片取色器帮助您从照片、截图或设计稿中取得某个位置的颜色。它会将预览位置对应到方向校正后的原图像素,提供颜色代码、透明度和像素坐标。

如何使用

  1. 选择或拖入图片。
  2. 点击、触摸或拖动图片预览,在结果区查看当前像素。
  3. 借助放大镜确认附近像素,核对 X、Y 坐标与 Alpha。
  4. 复制需要的 HEX、RGB 或 HSL,也可以从最近选择的颜色中复制 HEX。

支持格式

  • 支持 PNG、JPG/JPEG 和静态 WebP 图片。每次选择或拖入一张图片。
  • 文件最多 100 MiB、4000 万像素,单边不超过 16384 像素。处理大图需要更多内存,请按设备性能选择合适的图片。

结果说明

  • HEX、RGB 和 HSL 表示同一解码后像素的颜色;Alpha 单独表示透明度,范围为 0~255。
  • 坐标从左上角 (0, 0) 开始,基于方向校正后的原图宽高,不是屏幕上的预览尺寸。
  • 取色读取原图像素,不使用主色分析所用的缩小采样。预览缩放和设备像素比不会改变对应的原图坐标。
  • 完全透明像素会明确标记为透明;其 RGB 数字不能代表可见颜色。最近颜色只保留在当前页面。

准确查看原图颜色

  • 放大镜显示当前位置附近的原图像素,帮助区分相邻颜色;移动到图片边缘时只显示有效范围。
  • 浏览器可能对图片色彩配置进行转换,结果表示当前浏览器解码后的像素值。不同显示设备的视觉效果可能有所差异。

隐私

图片仅在您的浏览器中处理,不会上传到服务器。

工具不会自动保存输入或结果。请在清空或离开页面前复制或下载需要保留的内容,并保留原始图片。

FAQ

如何从图片取得 HEX 颜色?

选择图片后点击或触摸目标位置,再点击结果中的复制 HEX。放大镜与坐标可以帮助确认取到的像素。

HEX、RGB 和 HSL 有什么区别?

它们是颜色的不同写法:HEX 使用十六进制,RGB 使用红绿蓝数值,HSL 使用色相、饱和度和亮度。这里同时提供三种表示。

为什么透明像素有 Alpha?

Alpha 记录像素的不透明程度,0 表示完全透明,255 表示完全不透明。颜色代码与 Alpha 需要一起理解透明图片的效果。

预览缩小后取色是否准确?

预览上的位置会映射到方向校正后的原图像素,再读取该像素,使用的不是缩小预览的混合颜色。放大镜和坐标可用于核对。

返回开发者工具分类首页