DOMPrompter：点击 DOM 元素，AI 就知道该改哪里

用 Cursor 或 Claude 改前端时，最头疼的往往不是 AI 本身，而是怎么告诉它“就是这个元素，就是这里，改成这样”。

截图没有坐标，没有层级，没有结构。自然语言描述又很容易模糊，最后 AI 改错地方、来回返工。

所以我做了 DOMPrompter。

它是一个 macOS 工具，让你直接点击页面上的 DOM 元素，然后把这个元素的尺寸、间距、位置、层级整理成结构化 prompt，直接发给 Cursor、Claude Code、Copilot。

它适合这些场景：

• 前端 UI 微调

• spacing / sizing / alignment 调整

• vibe coding 里的精确改界面

• 减少截图说明和猜类名的成本

当前版本支持：

• Server Mode：连接 localhost 开发环境

• HTML Mode：直接打开本地 HTML 文件

• 结构化 Prompt 生成

• 兼容 Cursor / Claude Code / GitHub Copilot

GitHub：

https://github.com/hooosberg/DOMPrompter

App Store：

https://apps.apple.com/us/app/domprompter-ai-coding-prompt/id6761685716?mt=12

如果你也在做 AI coding 或前端协作，很欢迎交流你的真实工作流。