首页 › 前端工具 › 图片取色
IC

图片取色

上传图片后点击任意位置获取像素颜色值,支持放大镜效果

功能上传图片取色 / Canvas 像素采样
输出格式HEX / RGB
放大镜鼠标悬停显示放大像素
历史记录最多保存 20 条
请上传图片后点击任意位置取色
图片状态未加载
取色次数0
历史上限20
放大镜隐藏

图片取色器说明

图片取色器允许上传任意图片,通过点击图片上的任意位置获取该像素点的精确颜色值。

使用方法:点击"选择图片"按钮上传图片,图片加载后,在图片上移动鼠标可查看放大镜效果(显示鼠标周围像素的放大区域),点击即可取色。

技术原理:使用 Canvas API 将图片绘制到画布上,通过 getImageData 方法读取指定像素的 RGBA 值,再转换为 HEX 格式。

放大镜效果:鼠标悬停时,在鼠标位置附近显示一个 120x120 的放大区域,中心十字标记当前像素,方便精确取色。

历史记录:每次取色自动记录到历史列表,最多保存 20 条。点击历史记录中的颜色可快速复制其 HEX 值。

前端工具