Glyph WidgetsGlyph Widgets
关于联系隐私条款在Ko-fi上支持

© 2026 Glyph Widgets. 保留所有权利。

·

100% 客户端处理

颜色选择器

最后更新:2026年3月6日

使用EyeDropper API从屏幕中选取颜色,或以HEX、RGB或HSL格式输入颜色。即时在所有主要颜色格式之间转换。

功能

  • ▶从屏幕任意位置选取颜色
  • ▶现代浏览器中的EyeDropper API支持
  • ▶在HEX、RGB、HSL、HSB、CMYK之间转换
  • ▶复制颜色值到剪贴板
  • ▶颜色历史记录跟踪
  • ▶加载后可离线工作

如何使用此工具

1

从屏幕选取

点击「从屏幕选取」以激活EyeDropper工具。点击屏幕上的任意位置即可捕获该颜色。适用于任何可见内容,包括其他应用程序。

2

使用颜色输入

点击颜色方块以打开原生颜色选择器。这在所有浏览器中都有效,并提供了一种可视化的颜色选择方式。

3

手动输入值

直接输入HEX值(例如#3B82F6),或调整RGB和HSL滑块以进行精确控制。所有格式会在您输入时自动更新。

4

复制并使用

点击任何格式旁边的复制按钮以将其复制到剪贴板。使用颜色历史记录快速访问之前选取的颜色。

颜色选择方法

颜色选择器支持多种输入方法:用于视觉选择的原生HTML5颜色输入、用于从屏幕任意位置采样颜色的EyeDropper API,以及直接输入HEX、RGB或HSL值。

EyeDropper API

当您点击「从屏幕取色」时,浏览器会激活其原生EyeDropper界面。它会显示光标下像素的放大视图,让您可以点击以采样显示屏上任何可见的颜色,甚至是其他应用程序中的颜色。

色彩空间转换

颜色转换遵循标准数学公式。RGB转HEX将十进制值转换为十六进制。RGB转HSL根据色轮位置计算色相,根据颜色强度计算饱和度,根据最小/最大RGB值的平均值计算亮度。

浏览器兼容性

EyeDropper API需要Chrome 95+、Edge 95+或Opera 81+。我们会检测浏览器支持情况并显示相应的界面。原生颜色输入和手动输入在所有现代浏览器中都可作为后备方案使用。

隐私与安全

所有处理都使用JavaScript在您的浏览器中本地进行。没有任何颜色数据、屏幕截图或信息会被发送到外部服务器。您的颜色历史记录仅存储在浏览器的localStorage中。

常见问题

点击「从屏幕选取」按钮以激活EyeDropper工具。您的光标会变成放大镜 - 点击屏幕上的任意位置即可捕获该颜色。此功能需要支持EyeDropper API的现代浏览器(Chrome 95+、Edge 95+)。

相关工具

颜色转换器

在所有颜色格式之间转换

对比度检查器

检查WCAG颜色对比度

调色板生成器

生成调色板

渐变生成器

创建CSS渐变

#3B82F6

此浏览器不支持屏幕颜色选取。请使用颜色输入框或手动输入值。

所有颜色格式

分享
HEX
#3B82F6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
HSB
hsb(217, 76%, 96%)
CMYK
cmyk(76%, 47%, 0%, 4%)

Tool History is a Supporter feature.

Tool Notes is a Supporter feature.