无需登录 数据私有 本地保存

屏幕取色器API - 系统级像素颜色拾取

14
0
0
0
支持 JPG/PNG/WebP,也可直接 Ctrl+V 粘贴截图
移动图片查看颜色,点击锁定
悬停查看颜色
颜色微调
0
0
#FF5733
HEX #FF5733
RGB rgb(255, 87, 51)
HSL hsl(11, 100%, 60%)
取色历史
暂无取色记录,开始取色吧!
收藏颜色
暂无收藏颜色,点击♥收藏吧!
常见问题与知识

屏幕取色器是一种能够从计算机屏幕任意位置拾取像素颜色的工具。它广泛用于UI设计、网页开发、图像处理、品牌配色等场景。设计师可以快速从参考图中提取配色方案,开发者可以精确匹配页面元素的颜色值,大幅提升工作效率。本工具支持EyeDropper API系统级取色、图片上传取色以及系统调色板三种方式。

EyeDropper API 是W3C标准中的一项现代浏览器API,允许网页应用访问系统级的颜色拾取器,从屏幕任意位置(包括浏览器窗口外部)提取颜色。目前Chrome 95+、Edge 95+、Opera 81+等Chromium内核浏览器已支持该API。Firefox和Safari暂不支持。使用该API需要HTTPS安全上下文或localhost环境。如果浏览器不支持,您可以使用本工具的图片取色功能作为替代方案。

点击「图片取色」标签,上传图片或使用Ctrl+V粘贴截图。鼠标在图片上移动时,右侧放大镜会显示像素级放大视图(桌面端),帮助精确定位。鼠标悬停实时预览颜色,点击即可锁定该颜色。锁定的颜色会自动更新到预览区并加入历史记录。移动端支持触摸操作,手指滑动查看、点击锁定。

HEX(如#FF5733)是十六进制颜色表示法,最常用于网页CSS中,简洁且兼容性最好。RGB(如rgb(255,87,51))使用红绿蓝三通道0-255的数值表示,直观易懂。HSL(如hsl(11,100%,60%))使用色相(Hue)、饱和度(Saturation)、亮度(Lightness)表示,更贴近人类对颜色的感知,适合进行颜色调整和配色方案推导。本工具同时展示三种格式,方便不同场景使用。

取色后,您可以通过亮度和饱和度滑块对颜色进行细微调整。滑块范围为-50到+50,表示在HSL颜色空间中相对调整。调整后的颜色实时反映在预览色块和各格式数值中。点击「重置微调」可恢复到原始取色值。这个功能特别适合需要微调配色方案的场景,无需反复重新取色。

本工具提供两种颜色保存方式:历史记录自动保存最近20次取色结果,点击历史色块可快速回看;收藏功能(点击♥按钮)可将重要颜色长期保存,最多50个。所有数据存储在浏览器localStorage中,关闭页面后不会丢失。您也可以点击任意颜色格式旁的复制按钮,将颜色值复制到剪贴板。