屏幕取色器(吸管)
用浏览器吸管从屏幕上任何位置取色,得到 HEX、RGB、HSL、OKLCH 和最接近的 CSS 颜色名称。可在 Chrome 和 Edge 中使用。
这个吸管利用浏览器内置的 EyeDropper API,吸取屏幕上任意像素的颜色——不管它来自另一个应用、一张照片、一帧视频还是一个网页。你会得到 HEX 代码,以及 RGB、HSL、HSV、OKLCH 和最接近的 CSS 颜色名称。不会上传任何内容:浏览器只会把你点击的那一种颜色交给页面。
使用方法
- 保持勾选“点击按钮时打开吸管”,然后点击“计算”按钮(在文本框中按 Enter 则改为转换输入的颜色)。
- 把放大镜移到想要的像素上并点击(按 Esc 取消)。
- 从结果中复制 HEX、RGB 或 HSL 值。
- 浏览器没有吸管?取消勾选,然后输入或粘贴颜色来转换。
计算公式
浏览器以 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,移动浏览器也没有。
网站能借此读取我的屏幕吗?
不能。浏览器只在你点击之后才打开吸管,页面只会收到你选的那一种颜色,绝不会收到屏幕截图。
为什么吸到的颜色和设计稿不一样?
屏幕会应用色彩配置文件、护眼滤镜和缩放,图片也可能被压缩过。要获得精确数值,请直接读取源文件中的代码。
资料来源
最后更新:
包含这些输入的页面地址: https://kakao.mobile/zh/tools/screen-color-picker/
引用此工具
kakaoCalc. (2026, November 8). 屏幕取色器(吸管). https://kakao.mobile/zh/tools/screen-color-picker/
“屏幕取色器(吸管).” kakaoCalc, 8 Nov. 2026, kakao.mobile/zh/tools/screen-color-picker/.