图片取色器
从图片吸取像素颜色,放大镜精准定位,输出 HEX/RGB/HSL 并记录历史,可一键提取整图主色调色板,纯浏览器本地处理不上传。
纯前端处理,数据不上传
拖拽或点击选择图片
图片不会上传,本地取色
工具介绍
做设计、配色或还原界面时,常常需要从一张图里取出某个颜色的准确数值:看中海报里的某种蓝、想复用截图里按钮的颜色、从照片中提取主色做配色方案。靠肉眼估颜色既不准也难复现,用取色器(吸管)直接吸取像素颜色才能拿到精确的 HEX/RGB 值。
本工具就是一个在线图片取色器:拖入一张图片后,在图上移动时会弹出放大镜,把光标处的像素放大约 10 倍并标出中心像素,便于对准细小的图标、文字或边缘;点击即吸取该像素的精确颜色,并同时给出 HEX、RGB、HSL 三种格式,每种都能单独一键复制,直接粘贴进设计稿、CSS 或代码。取到的颜色会加入下方的取色历史,方便对比和反复取用,历史也可一键清空。
除了逐点取色,工具还内置「提取主色」功能:对整张图片做简单颜色量化,按出现频率聚合出一组主色调色板,几秒钟就能从一张海报、照片或截图里提炼出配色方案,无需手动一个个吸取。
整个取色与量化过程都通过浏览器 Canvas 在本地完成,图片不会上传到任何服务器,处理未公开的设计稿或私人图片同样放心。无需安装专业设计软件,打开网页即可随手取色、提取配色。
使用方法
- 拖拽或选择一张图片。
- 在图片上移动,放大镜会显示光标处的放大像素与实时颜色,便于对准细小区域;点击吸取该像素颜色。
- 取到的颜色以 HEX / RGB / HSL 三种格式展示,各格式可单独一键复制,并加入下方取色历史。
- 点击「提取主色」可对整图量化,生成一组主色调色板;历史与调色板中的颜色点击即复制,历史可一键清空。
常见问题
- 图片会上传服务器吗?
- 不会。取色基于浏览器 Canvas 在本地读取像素,图片不会上传到任何服务器。
- 能精确取到某个像素吗?
- 可以。移动时会弹出放大镜,把光标处放大约 10 倍并标出中心像素方框,便于对准细小图标或文字;点击即锁定该像素的精确颜色值。
- 支持哪些颜色格式?
- 同时显示 HEX、RGB、HSL 三种常用格式,每种都可单独复制,方便直接粘贴到设计稿、CSS 或代码中。
- 「提取主色」是怎么算的?
- 工具对整张图片像素做简单颜色量化(按色彩分桶聚合并按出现频率排序),取出占比最高的若干种颜色组成主色调色板,适合快速从图片中提炼配色方案。
- 取色历史会保存吗?
- 历史与调色板仅保存在当前页面会话中,刷新或关闭后清空,不会上传或长期存储,可随时一键清空。