HEX 颜色拾色器
HEX 使用 6 位十六进制数字表示颜色，例如 #5b25d5，广泛用于 CSS 和设计软件。
在线拾色器 - 图片取色与屏幕取色
免费在线拾色器，支持从图片或屏幕中提取精确颜色。上传、粘贴或拖入图片，即可获取 HEX、RGB、RGBA 和 HSL 颜色值。
将图片拖到这里
上传图片、拖入此区域，或从剪贴板粘贴截图。
支持 PNG、JPG、GIF、WebP 以及浏览器支持的其他图片格式
颜色值
当前颜色
HEX
#5b25d5RGB
rgb(91, 37, 213)RGBA
rgba(91, 37, 213, 1)HSL
hsl(258, 70%, 49%)图片在浏览器本地处理，不会上传到服务器。
色卡
当前选中的颜色显示在上方，点击铅笔可以编辑颜色或打开屏幕取色器。
#5b25d5阶梯色卡
选择当前颜色的更深或更浅色阶。
在线图片拾色器
使用这个取色器可以从照片、截图、设计稿或任意图片中识别颜色。点击准确像素即可获得可直接使用的 CSS 颜色代码；浏览器支持时还可以使用屏幕取色。
从任意图片取色上传、拖入或粘贴图片，然后采样需要的准确像素。
屏幕取色器浏览器支持时，使用原生 EyeDropper API 从屏幕任意位置取色。
常用颜色格式获取适用于 CSS 和设计工具的 HEX、RGB、RGBA 与 HSL 值。
隐私安全，本地处理图片留在浏览器中处理，无需上传图片，也无需注册账号。
拾色器使用方法
1
选择取色方式
输入 HEX、直接选择颜色，或在浏览器支持时使用屏幕取色。
2
上传图片
选择图片、将图片拖入上传区域，或从剪贴板粘贴截图。
3
点击像素
在图片中点击或触摸想要检查的准确位置。
4
复制颜色值
复制 HEX、RGB、RGBA 或 HSL 值，并用于 CSS 或设计项目。
什么是图片取色器？
图片取色器也叫拾色器、吸管工具或颜色采样器，可以读取图片中特定像素的颜色。当你需要匹配网站、Logo、照片、截图或 UI 设计的颜色时，它非常实用。本在线取色器会将像素转换为常见的 HEX、RGB、RGBA 和 HSL 颜色代码。
HEX、RGB、RGBA 与 HSL 颜色代码
不同的设计和开发工具会使用不同的颜色格式。拾色器会同时展示同一像素的多种格式，方便复制项目需要的颜色值。
RGB 与 RGBA
RGB 表示红、绿、蓝三个通道的数值；RGBA 额外包含透明度，适合有叠加效果的设计。
HSL 颜色值
HSL 使用色相、饱和度和亮度表示颜色，调整配色方案时更加直观。
拾色器的常见使用场景
网页设计
从截图中匹配品牌颜色，并将其用于 CSS 变量、按钮或背景。
平面设计
从照片、插画和灵感板中采样颜色，建立统一的调色板。
UI 开发
检查设计稿或现有界面的颜色，并在组件库中还原准确颜色。
无障碍检查
复制前景色和背景色到对比度检查器，检查文字可读性。
拾色器常见问题
如何从图片中取色？
将图片上传、拖入或粘贴到取色器中，然后点击想要的准确像素，工具会显示它的 HEX、RGB、RGBA 和 HSL 值。
什么是 HEX 拾色器？
HEX 拾色器会识别颜色并返回十六进制 CSS 颜色值，例如 #5b25d5。这种格式常用于网站和设计工具。
可以从屏幕上取色吗？
支持 EyeDropper API 的浏览器可以。点击“屏幕取色”，然后按照浏览器的颜色选择提示操作即可。
我的图片会被上传吗？
不会。图片解码和像素采样都在浏览器本地完成，不需要账号，也不需要图片上传服务器。
支持哪些颜色格式？
结果包括 HEX、RGB、RGBA 和 HSL，每种格式都有独立的复制按钮，可快速用于 CSS 和设计软件。
为什么浏览器不能使用屏幕取色？
屏幕取色依赖浏览器对 EyeDropper API 的支持，并且必须由用户操作触发。如果不可用，可以上传图片或输入 HEX 值。