屏幕取色器 - 图片工具 · 萤炬工具箱

屏幕取色器能吸取屏幕上任意位置的颜色，不限于浏览器窗口内——设计稿、其他软件界面、视频画面里的颜色都能取，输出 HEX、RGB、HSL 三种格式并保留取色历史。它用的是浏览器的 EyeDropper API，点击取色时需要你授权，且不是所有浏览器都支持这个能力。基于浏览器 EyeDropper API，需要用户授权。

屏幕取色器能吸取屏幕上任意位置的颜色，不限于浏览器窗口内——设计稿、其他软件界面、视频画面里的颜色都能取，输出 HEX、RGB、HSL 三种格式并保留取色历史。它用的是浏览器的 EyeDropper API，点击取色时需要你授权，且不是所有浏览器都支持这个能力。

使用步骤

1. 点击开始取色按钮。
2. 浏览器弹出授权后，屏幕进入取色模式。
3. 移动到目标位置点击确认颜色。
4. 复制需要的格式，历史记录里可回看之前取过的颜色。

功能与限制

• 基于浏览器 EyeDropper API，需要用户授权。
• 并非所有浏览器都支持，移动端普遍不可用。
• 输出 HEX / RGB / HSL 并保留取色历史。
• 不支持时可改用「图片取色」在截图上取色。

常见问题

点了没反应或者提示不支持怎么办？

EyeDropper API 目前主要在基于 Chromium 的桌面浏览器上可用，Safari 与部分浏览器还没实现，移动端普遍不支持。这种情况改用「图片取色」——先截图再在图上取色，兼容性没有限制。

为什么每次取色都要授权？

读取屏幕像素涉及隐私，浏览器要求用户主动触发并确认，不允许网页静默取色。这是安全设计，无法跳过。

能取到浏览器窗口外面的颜色吗？

可以，这正是它相对图片取色的优势——整个屏幕范围内都能吸取，包括其他应用的界面和播放中的视频画面。

取到的颜色和设计稿标注的不一样？

屏幕取色拿到的是最终渲染结果，可能受显示器色彩配置、系统色彩管理、以及界面上叠加的半透明层影响。要拿到设计稿的原始定义值应该直接看设计文件的色值标注。