屏幕颜色拾取器:在浏览器里取出颜色的 RGB 值,支持四种取色方式——① 用 Chrome / Edge 95+ 的 EyeDropper 直接拾取屏幕任意位置(包括其他标签页、其他桌面应用);② 把截图拖进页面或选择本机图片,用 15×15 像素放大镜逐点取色;③ 拾取本页任意元素声明的 background-color / color;④ 系统取色器或直接输入色值。取到的颜色一次给出 HEX、HEXA、RGB、RGBA、CSS 空格写法、HSL、HSLA、HSV、CMYK、Lab 共 10 种格式,外加最近 CSS 颜色名、最近 web 安全色、相对亮度、建议文字色、黑白底 WCAG 对比度判定,以及互补、类似、三角、分裂互补、四等分、单色明度阶 6 套配色和 CSS / SCSS / Tailwind / JSON 代码片段。全程在本机完成,图片不上传。
使用方法:先取一个颜色(点「拾取屏幕颜色」后鼠标会变成十字准星,按 ESC 可取消;或在图片区点「载入示例图」再点图上像素),色值会出现在「当前颜色」和下面三张结果面板里,每一行右侧都有独立「复制」按钮,也可以一次「复制全部格式」。取过的颜色按本机保存在「本机历史」,点色块即可重新载入,最多保留 24 个。
示例:示例一生成一张内置示例图(240×135,四个横带分别是灰阶、色相、纯色块和 S×V 网格)并自动取中心像素;示例二填入 #2f6fed 展示全部输出;示例三进入本页元素取色模式,鼠标移到任意元素上会浮出颜色与来源,点一下即取色。
注意:EyeDropper 只在安全上下文(https 或本机地址)可用。用 http 打开本页时按钮会变虚线灰底,但仍然可以点——点一下会在提示条里说明原因,取色区上方的说明也会常驻写明当前环境和解决办法,改成 https 访问即可恢复。元素取色读的是 CSS 声明值,半透明叠加、图片内容和 canvas 绘制结果取不到,这类需求请把图片拖进「从图片取色」。超大图片(边长超过 4096)会先等比缩放再取色,页面会标注实际尺寸。只想在多种格式之间来回换算,可以用同站的「颜色转换」工具。