其他
取色器
取色器工具是一款从图片中提取颜色(颜色代码)的工具。载入上传的图片或图片 URL 后,可通过显示的放大镜放大,并按像素点击拾取颜色。
将图片拖到这里
或
支持 PNG / JPG / WebP / GIF / BMP / SVG(最大 20MB)。.png,.jpg,.jpeg,.webp,.gif,.bmp,.svg
已提取的颜色0 项
点击图片中的像素后,颜色将添加到这里。
相关工具
二维码生成
将网址、Wi-Fi、邮件、短信、电话、联系人、地理位置、日历事件、文本生成二维码的免费二维码生成器,可自定义尺寸、颜色与 Logo,全程在浏览器中完成。
抽签 / 抽奖
从名单列表或数值范围中随机抽取 1~N 项的免费抽奖、抽签工具,支持不重复抽取、卷轴动画与历史记录,适合年会抽奖、课堂点名,全程在浏览器中完成。
番茄钟
按 25 分钟专注、5 分钟休息循环的免费在线番茄钟,支持圆形进度、提示音、全屏与画中画弹窗,打开即用、无需下载,适合学习与工作专注,全程在浏览器中完成。
颜色代码转换
在 HEX、RGB、HSL、HSV、OKLCH 颜色代码之间相互转换的免费工具,支持透明度(RGBA、8 位 HEX)与 CMYK 参考值,一键复制任意格式,全程在浏览器中完成。
对比度检查器
实时计算前景色与背景色对比度的免费颜色对比度检查器,判定 WCAG 2.1/2.2 AA、AAA 是否达标,并支持达标色建议、色盲(色觉)模拟与 APCA,全程在浏览器中完成。
单位换算
在长度、重量、温度、面积、体积、速度等多种单位之间相互换算的免费单位换算工具,支持 cm 与英寸、摄氏与华氏等实时换算,全程在浏览器中完成。
取色器是什么?
取色器工具是一款从图片中提取颜色(颜色代码)的工具。载入上传的图片或图片 URL 后,可通过显示的放大镜放大,并按像素点击拾取颜色。
取得的颜色可在 HEX(#RRGGBB)、RGB、HSL 三种形式间切换显示。放大镜倍率提供 5x / 10x / 20x 三档。拾取多种颜色组成调色板后,可将其按 JSON 或 CSS 变量形式复制到剪贴板,直接粘贴到设计稿、样式指南或代码中。
在 Chrome 系浏览器中还可使用「从屏幕拾取颜色」(EyeDropper API),不限于图片,可在桌面屏幕全局拾取颜色。载入的图片全部在用户的浏览器内处理,不会发送至外部服务器。全程在浏览器中完成。
使用方法
- 上传图片文件,或粘贴图片 URL 载入。
- 将光标移到图片上时会显示放大镜。选择放大镜的倍率(5x / 10x / 20x)。
- 点击想按像素精确确认的位置,该点的颜色会被加入调色板。
- 在 HEX / RGB / HSL 之间切换颜色显示形式以确认。
- 在支持的浏览器中,可通过「从屏幕拾取颜色」按钮从桌面屏幕任意位置拾取颜色。
- 通过「复制 JSON」「复制 CSS 变量」可一并导出提取的调色板。
使用场景
- 希望从设计稿中取出配色并作为 Web 网站 CSS 变量实现的 Web 设计师、前端工程师。
- 希望从竞品站或参考设计的截图中分析配色的 UI 设计师。
- 希望从照片或素材中提取品牌色以制作配色指南的品牌负责人。
- 希望严格取出插画或照片特定部分颜色的插画师、摄影师。
- 希望让资料或演示中所用图表的颜色与参考图保持一致的商务人士。
注意事项
- 「从屏幕拾取颜色」(EyeDropper)仅在部分 Chrome 系浏览器可用。Firefox / Safari 等不支持时不会显示。
- 通过图片 URL 载入时,若目标图片服务器不允许 CORS(Cross-Origin Resource Sharing),颜色获取(getImageData)可能失败。
- 颜色在 sRGB 色彩空间中取得。广色域(如 Display P3)图片会显示转换为 sRGB 后的值。
- 放大镜中显示的颜色可能与整图视觉颜色略有不同(受相邻像素影响)。
- 本工具按像素取色。与 AI「全图代表色提取」的目标不同。