图片颜色拾取器
从任意图片中提取精确颜色。点击任意像素即可获取精确的 HEX、RGB 和 HSL 颜色值。非常适合设计师和开发者。
将图片拖拽到此处,或点击选择
支持 PNG、JPG、GIF、WebP、BMP
为什么选择 图片颜色拾取器
通过图像拾色器,您可以上传任何图片并通过单击提取任何像素的准确颜色。内置像素放大器可以轻松定位精确点,即使在复杂的图像中也是如此。每个拾取的颜色都以十六进制、RGB 和 HSL 格式显示,并具有一键复制、实时色样预览以及最近 10 种拾取颜色的历史记录。一切都在浏览器中运行 - 您的图像永远不会上传到服务器。
- ✓单击任何像素即可立即提取其 HEX、RGB 和 HSL 值
- ✓可调节像素放大器 (2x–16x),用于精确定位
- ✓具有自动文本对比度调整功能的实时颜色预览样本
- ✓颜色历史记录面板跟踪您最近选择的 10 种颜色
- ✓每种颜色格式的一键复制 - 为 CSS 或设计工具做好准备
- ✓100% 客户端处理 — 图像永远不会离开您的设备
使用步骤
- 1通过将图像拖到放置区域或单击选择文件来上传图像。
- 2将鼠标悬停在图像上可查看光标周围的放大像素网格。
- 3如果您需要更高或更低的精度,请调整放大器缩放滑块。
- 4单击任意像素即可锁定并提取其颜色。
- 5在预览样本旁边查看提取的十六进制、RGB 和 HSL 格式的颜色。
- 6一键将任何颜色格式复制到剪贴板。
- 7浏览您的颜色历史记录以重新访问之前选择的颜色。
常见问题 (FAQ)
颜色选择器如何从图像中提取颜色?
该工具将图像绘制到 HTML5 Canvas 元素上,然后使用 getImageData() API 读取您单击的像素的原始 RGBA 值。这可以直接从图像位图中提供准确、无损的颜色数据。
放大镜是做什么用的?
放大器会在光标周围显示放大的像素网格,使您可以轻松定位所需的确切像素 - 即使在详细或嘈杂的图像中也是如此。您可以将缩放级别调整为 2 倍到 16 倍。
为什么有三种颜色格式?
不同的环境需要不同的格式。 HEX 是 CSS 和设计工具的标准。当您需要指定单个通道值或使用 rgba() 实现透明度时,RGB 非常有用。 HSL 是手动调整色调、饱和度或亮度的最直观格式。
颜色历史记录是如何存储的?
颜色历史记录仅保存在浏览器会话中 - 它不会保存 to 磁盘或发送到任何服务器。只要页面保持打开状态,它就会持续存在,并在您关闭或刷新选项卡时被清除。
我可以从透明 PNG 图像中选取颜色吗?
是的。该工具读取原始像素数据,包括 Alpha 通道。对于完全透明的像素,RGB 值反映底层画布背景。对于半透明像素,您可以获得该像素存储的 RGB 值。
支持哪些图像格式?
支持浏览器可以呈现的任何格式 - 包括 JPG、PNG、WebP、GIF(第一帧)、BMP 和 SVG。图像绘制在画布上,因此浏览器支持是唯一的限制。
权威参考资料
相关工具
继续探索同一场景下的实用工具。
