点击图片拾色
选择本地图片后点击预览图任意位置，读取该像素颜色。
输出常用色值
同步输出 HEX、RGB 和 HSL，方便设计和前端样式复用。
图片不上传服务器
图片读取、预览和取色都在当前浏览器本地完成。
图片取色 · 浏览器本地处理
图片取色器
从本地图片中点击提取颜色，输出 HEX、RGB 和 HSL，适合设计取样和品牌色复核。图片不会上传服务器。
#000000
HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
处理方式
本地
HEX：#000000
RGB：rgb(0, 0, 0)
HSL：hsl(0, 0%, 0%)
请选择图片开始取色。
选择本地图片后点击预览图即可取色，不上传服务器。
工具使用说明
怎么用图片拾色器工具
选择图片
上传需要拾色的截图、Logo、海报或设计稿。
点击目标颜色
在预览图上点击需要提取颜色的位置，页面会读取对应像素。
使用色值
把 HEX、RGB 或 HSL 用到 CSS、设计工具或配色记录里。
功能说明
这个工具解决什么问题
图片拾色器工具能做什么
选择本地图片后点击预览图拾取颜色，输出 HEX、RGB 和 HSL，图片只在浏览器本地处理，不上传服务器。
适合从截图、品牌 Logo、商品图和 UI 设计稿里快速确认颜色。
为什么默认本地拾色
浏览器 Canvas 可以直接读取图片像素，不需要服务端上传或第三方接口。
本地处理更适合内部截图、未公开设计稿和隐私图片。
常见问题
关于图片拾色器工具，用户常问这些
图片会上传服务器吗？
不会。图片只在当前浏览器读取和取色。
支持哪些色值格式？
当前输出 HEX、RGB 和 HSL。
可以从截图取色吗？
可以，只要截图能被浏览器读取，就可以点击提取颜色。
点击边缘颜色为什么可能不同？
图片边缘常有抗锯齿和透明混合像素，建议多点几次确认。