点击图片取色
上传本地图片后点击任意像素，获取该点 HEX、RGB、HSL 和坐标。
适合精确取样
对 Logo、按钮、背景、商品图局部颜色做精确复核。
本地 Canvas 读取
颜色读取只在浏览器本地 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，并显示点击位置的 x/y 坐标。
和主色提取有什么区别？
主色提取会自动统计主要颜色；这个工具用于点击指定像素精确取色。
可以用于 CSS 吗？
可以，复制 HEX、RGB 或 HSL 后可直接用于 CSS 和设计工具。