已更新9月 2026
Upload an image, then hover/click on it to pick colors. Everything stays in your browser.
Picked colors (click to copy)
如何使用从图像中选择颜色
- 上传图像 - 徽标、屏幕截图、照片、任何来源。
- 单击所需颜色的像素 - 放大以获得精确度。
- 复制十六进制/RGB 值 - 为 CSS 或设计工具做好准备。
- 采样实体区域，而不是边缘 - 抗锯齿和 JPG 噪点实时显示边界。
从图像中选择颜色是什么？
图像颜色选择器读取您在上传图像中单击的任何像素的确切颜色 - 返回十六进制代码 (#E67E22) 和 RGB 值，为 CSS、设计工具或绘画匹配做好准备。它是吸管，针对您可以获得的任何图像。
反复出现的需求：某种颜色存在于某个地方 - 品牌的徽标、竞争对手的按钮、照片的日落、产品照片 - 并且您需要它的精确值，而不是近似值。单击像素可以一步解决问题，而眯着眼睛看色轮则永远无法解决问题。
关于从图像中选择颜色
上传图像，单击像素，复制十六进制/RGB值。
提取作业：在风格指南缺失时从徽标中提取品牌颜色（日常机构任务 - 客户发送 JPG 徽标，您需要调色板），将 UI 颜色与参考设计或屏幕截图相匹配，从照片构建调色板（自然和电影剧照是调色板金矿 - 选择五个像素，您就有了一个方案），根据规范验证实现的颜色（屏幕截图页面，选择像素，比较），并从拍摄的样本中识别绘画/打印目标。
挑选技巧：缩放问题 - JPG 压缩会使平面颜色稍微变得斑驳，因此从颜色区域的中心挑选，而不是边缘（抗锯齿混合相邻区域的边缘）；对于渐变，请注意您正在对斜坡的一个点进行采样；对于品牌工作，在多个点对徽标的实体区域进行采样并取得共识。与我们的颜色转换器配对以进行格式更改 (hex↔RGB↔HSL) 和调色板生成器以围绕所选锚点构建方案。图像在您的浏览器中进行处理。
常见问题解答
JPG 压缩噪声和抗锯齿 — “平面”颜色在像素与像素之间存在几个单位的差异。对颜色区域的中心（最好是几个点）进行采样，然后采用模式。
如果可用，请使用 PNG/SVG 版本（无 JPG 噪音），从大的实心区域中进行选择，并根据任何已发布的品牌指南进行健全性检查。对于 SVG，颜色实际上是在文件代码中。
Hex (#RRGGBB) 和 RGB — 网络原生对。当工作流程需要时，使用我们的颜色转换器将其转换为 HSL 或其他格式。
是的 - 选择主要颜色（主题、背景、强调色）作为候选颜色，然后使用调色板生成器进行优化。具有凝聚力灯光的照片会产生自然和谐的调色板。
屏幕截图经过显示渲染和压缩——小幅变化是正常的。对于像素精确的规范工作，请从原始资源（导出的 PNG，而不是屏幕照片）中进行选择。