图片取色器会把上传图片绘制到画布，在点击位置读取像素的红、绿、蓝通道，并同时给出 HEX、RGB 和 HSL 表示。历史记录便于比较同一图片中的品牌色、背景色和高光区域。
为了适配工作区，超大图片的预览可能按比例缩小，工具会把指针位置映射回画布像素。单点颜色会受到压缩噪声、抗锯齿、半透明叠加和显示缩放影响，建立色板时应在相邻区域多取几个点再判断。
工具说明
使用步骤
上传参考图片
选择颜色显示正常且尽量保留原始质量的文件。
点击目标像素
在纯色区域中央取样，避开边缘抗锯齿和高光，必要时记录多个邻近点。
复制所需格式
根据 CSS、设计工具或文档规范选择 HEX、RGB 或 HSL。
支持范围与限制
- 输出格式
- HEX、RGB、HSL 三种表示，可直接复制
- 取色方式
- 上传图片后点击画面任意位置读取该像素的颜色
- 取的是什么
- 屏幕显示的像素值，不含色彩管理信息
- 色彩偏差来源
- 有损压缩会改变像素值，广色域图片在 sRGB 下显示也会偏移：取到的值不一定等于设计稿的原始值
- 典型用途
- 从截图或参考图里还原配色，或核对界面实现与设计稿是否一致
- 后续处理
- 需要转成 HSV、CMYK 等其它表示，用颜色转换器
典型使用场景
还原界面颜色
从截图提取按钮、背景和状态色，作为设计复核的起点。
整理图片配色
从摄影或插画中选取一组代表色，用于标题、图表或主题页面。
从参考图里还原配色方案
看到喜欢的界面或海报配色，逐点取色整理成一套色板，用于自己的设计。
使用前需要知道的事
- 压缩图片中的相邻像素可能略有差异，单次点击不一定代表设计源色。
- 取色结果来自文件解码后的像素，不包含印刷 CMYK 或专色信息。
- 颜色数值本身不能保证文字可读性，前景与背景仍需做对比度检查。
相关概念
- pixel sample
- 读取某个画布坐标处解码后的颜色通道值。
- anti-aliasing
- 用混合边缘像素让线条看起来平滑的技术，会影响边界取色。