ZH
我的工具

屏幕取色器(吸管)

用浏览器吸管从屏幕上任何位置取色,得到 HEX、RGB、HSL、OKLCH 和最接近的 CSS 颜色名称。可在 Chrome 和 Edge 中使用。

取消勾选则改为转换输入的颜色。
在吸管关闭、被取消或浏览器不支持时使用。
我的工具 →
广告

这个吸管利用浏览器内置的 EyeDropper API,吸取屏幕上任意像素的颜色——不管它来自另一个应用、一张照片、一帧视频还是一个网页。你会得到 HEX 代码,以及 RGB、HSL、HSV、OKLCH 和最接近的 CSS 颜色名称。不会上传任何内容:浏览器只会把你点击的那一种颜色交给页面。

使用方法

  1. 保持勾选“点击按钮时打开吸管”,然后点击“计算”按钮(在文本框中按 Enter 则改为转换输入的颜色)。
  2. 把放大镜移到想要的像素上并点击(按 Esc 取消)。
  3. 从结果中复制 HEX、RGB 或 HSL 值。
  4. 浏览器没有吸管?取消勾选,然后输入或粘贴颜色来转换。

计算公式

浏览器以 sRGB HEX(#rrggbb)返回像素颜色。HSL 和 HSV 来自标准的 RGB 公式;OKLCH 由线性 sRGB 经 OKLab 矩阵得到;最接近的名称是 CIEDE2000 色差最小的那一个。

在广色域(Display P3)屏幕上,浏览器会把取到的像素转换为 sRGB,所以非常鲜艳的颜色返回的饱和度可能略低。

示例

吸取一个常见“登录”按钮的蓝色,可能得到 #2563EB:rgb(37, 99, 235)、hsl(221.2, 83.2%, 53.3%),最接近的 CSS 名称是 royalblue——接近,但并不是同一种颜色。

常见问题

哪些浏览器支持吸管?

Windows、macOS、Linux 和 ChromeOS 上的 Chrome、Edge 和 Opera。Safari 和 Firefox 暂不支持 EyeDropper API,移动浏览器也没有。

网站能借此读取我的屏幕吗?

不能。浏览器只在你点击之后才打开吸管,页面只会收到你选的那一种颜色,绝不会收到屏幕截图。

为什么吸到的颜色和设计稿不一样?

屏幕会应用色彩配置文件、护眼滤镜和缩放,图片也可能被压缩过。要获得精确数值,请直接读取源文件中的代码。

资料来源

最后更新:

引用此工具
APA

kakaoCalc. (2026, November 8). 屏幕取色器(吸管). https://kakao.mobile/zh/tools/screen-color-picker/

MLA

“屏幕取色器(吸管).” kakaoCalc, 8 Nov. 2026, kakao.mobile/zh/tools/screen-color-picker/.

广告