关于 图片取色器
从一张图片里取色是设计师与前端开发者的日常需求：还原设计稿的品牌色、采集照片中的渐变参考、为 UI 组件挑选配套强调色。本工具把图片取色做成了浏览器内的吸管：上传或拖入图片后，鼠标在画面上移动即可实时预览光标所在像素的 HEX、RGB、HSL 值，配合 5×5 放大镜网格精准定位单个像素，点击即锁定颜色并自动加入历史记录（最多 12 条）。整个流程在浏览器本地完成，图片不会上传到任何服务器，隐私无忧。建议把它与「颜色转换器」「配色生成器」搭配使用，取色后直接转换格式或推导配色方案。
使用方法
- 打开 图片取色器 工具页面
- 根据需求输入或粘贴数据到输入区域
- 查看实时处理结果，使用复制按钮获取输出
使用场景
- 设计稿取色 — 上传视觉稿截图，用吸管精确点取品牌主色、辅助色与文字色，复制 HEX 直接写入 CSS 变量。
- 照片配色提取 — 从摄影作品或插画中采样主色调，为海报、Banner 或数据可视化挑选和谐的色彩组合。
- UI 还原核对 — 对比还原页面与设计稿的同位置像素色值，快速发现色差并修正 CSS，提升视觉还原度。
- 渐变采样 — 沿渐变方向多点取色，记录每个停止点的色值，用于在 CSS gradient 中复刻相同的色彩过渡。
- 无障碍对比 — 提取前景与背景色后，配合对比度计算判断文字可读性，确保配色符合 WCAG 可访问性标准。
常见问题
取色准确吗？
准确。工具从图片原始像素读取 RGB 值，不经过压缩或缩放重采样，保证与原图逐像素一致。
支持哪些图片格式？
支持 PNG、JPEG、WebP、GIF、BMP 与 SVG。SVG 会按其内在尺寸栅格化后取色。
图片会上传到服务器吗？
不会。所有图片在浏览器本地用 Canvas 解析与读取，不发生任何网络请求，可放心处理敏感截图。
放大镜里的方块是什么？
5×5 网格展示光标周围 25 个像素的放大效果，中心格即当前取色像素，方便在密集区域精准定位。
历史记录能保留多少条？
最多 12 条，新取色会自动置顶并去重，点击任一历史色块即可复制其 HEX 值。
有浏览器兼容性要求吗？
本工具兼容所有现代浏览器（Chrome、Firefox、Edge、Safari），无需安装任何插件或扩展。
可以离线使用吗？
首次加载后，部分功能在离线状态下仍可使用。页面资源加载后，核心逻辑完全在浏览器本地运行，不依赖网络。