吸管工具 - 颜色选择器

从任何网页抓取任何像素颜色并立即复制其十六进制代码。

色彩精准度是连接每个精美界面、品牌资产、数据可视化仪表盘和营销活动的纽带。然而，设计师和前端工程师仍然浪费无数时间，眯着眼在开发工具中查看十六进制代码，或截取页面截图，最终在 Photoshop 中进行采样。Eye Drop Tool——一款基于 Manifest V3 构建的轻量级浏览器扩展——将这种不便转化为一个简洁优雅的手势：点击工具栏图标，选择视口中的任意像素，精确的 #RRGGBB 值就会复制到剪贴板。一个轻巧的提示音确认操作后，您就可以立即回到工作状态，避免工作流程中断。 为什么这个扩展很重要 浏览器原生的颜色选择器已经存在多年，但大多数都深藏在检查器中，仅限于 DOM 中的元素，或被右键子菜单所限制。Eye Drop Tool 则通过一个始终存在的按钮展现了同样的强大功能，它可以作用于显示器渲染的任何内容——图像、画布、视频帧、SVG，甚至第三方插件。 功能亮点 一键激活 - 无需弹出窗口或设置面板。后台服务工作线程会立即注入选择器内容脚本，使空闲时内存开销接近于零。 通用像素采样——由于扩展捕获屏幕缓冲区而不是 DOM 树，因此它可以像静态 HTML 一样在动态渲染的 WebGL 场景、游戏和流视频上工作。 即时剪贴板复制——十六进制字符串会自动写入剪贴板；您可以将其直接粘贴到 Figma、VS Code 或 Slack 中，而无需中间对话框。 视觉确认提示——页面角落的微交互（“#ffcc33 已复制！”）向您保证操作已成功，并在 1.5 秒后消失。 用户利益 节省时间——无需绕道使用开发工具或外部应用。在设计冲刺过程中，这些时间累积起来就变成了几个小时。 减少认知负荷——保持相同的心理环境可以保持创造力；您无需玩弄窗户或切换焦点。 像素完美一致性——快速验证生产代码是否符合品牌风格指南，或营销模型是否符合可访问性对比度。 错误预防——手动输入十六进制代码会导致拼写错误；复制到剪贴板可以消除这种风险，从而实现更清晰的提交和更少的错误报告。 目标用户群体 UI/UX设计师 从实时原型中快速采样颜色，以便在设计系统中重复使用 Figma 审阅会议期间对色调进行微调 前端开发人员 验证 CSS 变量在不同状态下是否正确呈现 将鼠标悬停在暂存区中的按钮上并获取其活动颜色 质量保证工程师 确认 WCAG 对比度和品牌合规性 在回归测试期间，将生产版本与规范进行比较 数字营销人员和内容创作者 将临时图形与网站调色板相匹配 将英雄横幅拉至蓝色，作为最后一刻的社交板块