取色器与颜色提取工具 – 免费在线工具
我们的免费在线颜色提取工具让您只需单击即可从照片中拾取任意颜色——无需安装软件,也无需注册账户。上传图片后,悬停即可放大查看,点击任意像素即可立即显示其HEX、RGB、HSL和HSV数值,然后即可根据所选颜色生成完整的调色板。您可以随时下载结果。
如何从照片中拾取颜色
1
上传您的图片
将照片拖放到面板上,点击 上传照片,或使用Ctrl + V粘贴。支持JPEG、PNG、WebP、HEIC 与 GIF格式。
2
点击拾取颜色
将鼠标悬停在图片上,通过放大镜放大查看,然后点击任意位置即可拾取该像素的颜色。HEX、RGB、HSL和HSV数值将立即显示。
3
复制或生成调色板
点击任意数值字段即可将其复制到剪贴板;您还可以保存颜色以便日后使用,或生成完整的调色板,并将其导出为CSS变量或PNG色卡条。
主要功能
- 四种颜色格式 – 只需点击任意数值字段,即可以HEX、RGB、HSL和HSV格式查看并复制所拾取的颜色。
- 像素级精准放大镜 – 圆形放大镜会跟随光标移动,帮助您精准定位所需的像素。
- 8种调色板类型 – 生成邻近色、互补色、三角色、四角色、分裂互补色、单色、暗色调或浅色调的调色板,包含3–10个色块。
- 导出选项 – 一键复制所有调色板HEX代码、下载PNG色卡条,或将调色板导出为CSS自定义属性(
:root 变量)。
- 已保存颜色 – 将任意颜色收藏至浏览器中的个人已保存颜色面板,可随时清除。
- 支持HEIC格式 – HEIC/HEIF格式的iPhone照片会在取色前自动转换。
- 完全在浏览器中运行 – 您的照片绝不会上传到任何服务器。
- 免费且无限制 – 无需注册,无水印,无限制。
什么是颜色提取器?
颜色提取器(或称图片取色工具)是一种能读取照片中任意像素的精确颜色,并将其转换为设计和开发中常用标准颜色代码的工具。您无需凭肉眼估测颜色或手动输入数值,只需点击感兴趣的位置,工具便会为您完成转换——从屏幕显示的原始RGB数值,直至图形设计工作流程中使用的HSL和HSV表示形式。
调色板生成器在此基础上更进一步:只需选定一个基础颜色,它就会运用色彩理论生成和谐的配色方案,可直接用于CSS、Figma或任何设计工具。
常见用途
- 品牌颜色提取 – 从徽标或品牌照片中提取精确的HEX颜色代码,用于在网站或设计系统中保持颜色的一致性。
- 网页与UI设计 – 将配色与产品图片或首图相匹配,让您的版面更显和谐统一。
- 调色板生成 – 从单一关键色出发,为项目生成完整的互补色或邻近色方案。
- 印刷与插画 – 在调色或设置打印配置文件前,先从参考照片中取样,获取准确的RGB数值。
- CSS主题 – 直接将调色板变量导出至一个
:root 代码块中,可直接粘贴到样式表里使用。
常见问题
是的,该工具100%免费,没有使用限制。您无需创建账户,也无需提供任何付款信息。
不会。所有处理均在您的浏览器内使用HTML5 Canvas API完成。您的图片绝不会发送到任何服务器,因此您的隐私能得到充分保护。
该工具会同时以四种格式显示所拾取的颜色:HEX(例如 #3a7bd5),RGB(rgb(58, 123, 213)),HSL(hsl(216, 63%, 53%)),以及HSV(hsv(216, 73%, 84%))。点击任意字段即可立即复制。
当您将光标移动到图片上时,光标附近会出现一个圆形放大镜,显示周围像素的放大视图。这样您就能轻松定位并点击所需的确切像素,尤其是在包含精细细节或微妙色彩过渡的照片中。
点击图片上的任意像素以设置基础颜色,然后向下滚动至 调色板 部分。选择一种调色板类型(邻近色、互补色、三角色等),并拖动数量滑块以选择3–10个色块。调色板会即时更新。使用 复制颜色, 下载PNG,或 导出CSS 来获取结果。
导出CSS会复制一个 :root { } 代码块,其中将每个调色板颜色都定义为一个CSS自定义属性(例如 --color-1: #3a7bd5;)。您可以将其直接粘贴到样式表中,并在整个项目里引用这些变量。
可以。HEIC和HEIF文件会在图片显示前自动在您的浏览器中转换为JPEG格式。转换过程中会显示加载提示,且不会有任何文件被发送至我们的服务器。