点击像素取色
图片载入后点击任意位置，直接读取该像素的 HEX、RGB 和 HSL。
保留坐标信息
结果同时展示 x/y 坐标，方便复核图片某个具体区域的颜色。
图片本地处理
取色依赖浏览器 Canvas，图片不会上传到服务器，也不需要第三方接口。
图片取色 · 浏览器本地处理
图片配色提取器
选择本地图片后点击任意像素取色，输出 HEX、RGB 和 HSL。图片只在浏览器本地处理，不上传服务器。
#000000
HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
处理方式
本地
坐标：x=0，y=0
HEX：#000000
RGB：rgb(0, 0, 0)
HSL：hsl(0, 0%, 0%)
请选择图片开始取色。
选择本地图片后点击任意像素取色，不上传服务器。
工具使用说明
怎么用图片配色提取器
上传本地图片
选择要取色的图片，等待预览图在页面中显示。
点击目标位置
用鼠标点击图片上的任意像素，工具会读取该点颜色。
复制颜色值
根据需要使用 HEX、RGB 或 HSL 结果，用于 CSS、设计稿或配色记录。
功能说明
这个工具解决什么问题
图片配色提取器适合精确取样
当主色提取不够精确时，可以直接点击 logo、按钮、背景或图片局部，拿到具体像素颜色。
图片只进入当前浏览器页面，不会上传服务器。
坐标和颜色一起看更稳
同一张图的不同位置可能颜色差异很大，保留坐标能帮助你复核取样点是否正确。
如果需要整理整张图的主要配色，可以搭配图片配色提取工具一起使用。
常见问题
关于图片配色提取器，用户常问这些
取色会上传图片吗？
不会。图片读取和像素取样都在浏览器本地 Canvas 中完成。
支持哪些颜色格式？
当前输出 HEX、RGB 和 HSL 三种常用格式。
为什么点击后颜色和肉眼看到略有差异？
图片压缩、显示缩放和抗锯齿都可能造成局部差异，建议放大或多点取样复核。
能读取透明像素吗？
当前主要输出 RGB 颜色；透明区域可能显示为 Canvas 里的底色或原始像素结果。