Inspector

Inspector 是什么？

Inspector 是一款可视化编辑器，通过直接连接你的 AI 编程助手，弥合设计与代码之间的鸿沟。你无需用文字描述修改内容，也无需经历设计交接流程——只需点击实时 UI 中的任意元素，进行可视化调整，Inspector 便会将相应的修改直接写入你的代码库。它兼容 Claude Code、Codex 和 Cursor 等主流 AI 编程助手，将可视化编辑转化为真实的代码提交。

适用人群

• 前端开发者：希望在不切换设计工具和代码编辑器的情况下，更快地迭代 UI 变更。
• 设计工程师：需要一种直接的方式，将视觉调整转化为生产级代码，无需手动重新实现。
• 独立创始人及小团队：依赖 AI 编程助手，并希望从视觉调整到仓库推送实现无缝工作流。

核心功能

浏览器内可视化编辑

点击运行中 UI 的任意元素进行选中，然后直接移动、调整大小或编辑文本。Inspector 会将每个可视化操作转化为对应的代码变更，让你无需在文件中手动查找目标代码行。

AI 编程助手集成

Inspector 可连接你现有的 AI 编程助手——Claude Code、Codex 或 Cursor。当你进行可视化编辑时，助手会接收上下文并直接将变更写入本地代码库。这意味着你的助手始终参与其中，并能围绕视觉调整处理更复杂的逻辑。

完全本地运行

一切操作都在你的机器上执行。Inspector 连接任何本地代码库时，不会将你的代码或 UI 数据发送到外部服务器。你的工作保持私密，编辑工作流不依赖云基础设施。

macOS 原生应用

Inspector 提供原生 macOS 应用程序，为使用 Apple 硬件的开发者带来流畅、低延迟的体验。

突出优势

Inspector 将你的浏览器变成代码编辑器——点击、调整、推送，全程无需离开 UI。

大多数可视化编辑器生成抽象的设计文件或导出静态资源。而 Inspector 更进一步，通过你的 AI 编程助手编写真实的代码变更。这彻底消除了传统设计与开发之间的交接环节。你可以在测试和预览作品的同一环境中工作，代码更新会立即反映在你的仓库中。对于任何希望从视觉创意到提交代码只需数秒的人来说，这是一个实用的捷径。

值得一试，如果……

你使用 Claude Code、Codex 或 Cursor 等 AI 编程助手，并希望以更快的速度进行前端修改。如果你经常在浏览器检查器和代码编辑器之间来回切换以调整布局、文本或间距，Inspector 尤其有用。同样，如果你偏好可视化反馈循环，但又需要最终输出为干净、本地的代码而非设计原型，它也是一个不错的选择。