概述
HTML 取色器 - 拾取任意元素，提取颜色（HEX、RGB、HSL）、CSS、字体和布局。为 AI 编码工具生成提示词。
HTMLPicker 拾取网页上的任意元素，提取其 CSS、颜色、字体和布局信号——然后为 Cursor、Copilot、Claude Code 和 Codex 生成 AI 实现提示词。 🔑 核心功能 • 元素拾取 — 点击任意元素检查颜色（HEX/RGB/HSL）、字体、计算 CSS、选择器和 HTML • AI 提示词生成 — 将设计风格反推为实现提示词，适用于 Cursor、Copilot、Claude Code 和 Codex • 页面调色板 — 一键提取整页配色方案及频率分析 • 截图捕获 — 可见区域和全页面滚动截图 • 设计导出 — 将颜色、字体、间距导出为 JSON、CSS、Markdown 或 AI 上下文包 • 实时样式修改 — 在任何页面上实时修改颜色和字体 • DOM 导航 — 浏览父/子/兄弟元素的可视化层级 • 深色/浅色主题 — 自动适配系统主题 • 双界面 — 弹窗快速访问，侧边栏详细工作区 📋 使用方式 • 点击 HTMLPicker 图标打开侧边栏或弹窗 • 点击"拾取"然后悬停并点击页面上的任意元素 • 查看所有设计信息：颜色、字体、CSS、HTML、选择器、盒模型 • 使用 AI 反推页面的专业设计风格 • 将所有内容导出为 AI 提示词或结构化设计上下文 🎯 适用场景 • 前端开发者检查 CSS 和提取设计值 • Vibe 编码者为 Cursor、Copilot、Claude Code 和 Codex 生成 AI 提示词 • 设计师将视觉系统传达给 AI/开发团队 • 产品经理无需 DevTools 即可捕获设计规格 🌐 多语言支持 支持 18 种语言：English, 简体中文, 繁體中文, 日本語, 한국어, Deutsch, Français, Español, Português, Italiano, Русский, Nederlands, Polski, Türkçe, العربية, ไทย, Tiếng Việt, Bahasa Indonesia 🔒 隐私优先 HTMLPicker 不收集任何个人数据。所有处理均在浏览器本地完成。无需账号。无跟踪。可选的 AI 分析功能仅在您主动触发时，将压缩的设计证据发送到您自己的 API 密钥（BYOK）。 💡 支持开发 HTMLPicker 免费使用。如果您觉得有帮助，请考虑在 htmlpicker.com/donate/ 支持其开发
详情
隐私权
该开发者已声明，您的数据：
- 不会因未获批准的用途出售给第三方
- 不会为实现与产品核心功能无关的目的而使用或转移
- 不会为确定信用度或放贷目的而使用或转移
支持
若有任何疑问、建议或问题，请访问开发者的支持网站
