ツールについて
Design In The Browser 是一款 AI 驱动的视觉前端开发工具,它衔接了视觉设计与 AI 开发。用户可以在浏览器中点击任意网站元素,用自然语言描述所需的修改,并将指令(带截图)直接发送给集成在内置终端中的 AI 模型(Claude Code、Cursor 或 Gemini CLI)。这一流程消除了手动复制选择器或描述布局的需要,允许开发者快速查看、描述和修改元素,同时由 AI 处理代码编写。
主な機能
- 点击即改编辑功能,指令即时发送给 AI 命令行工具
- 代码编辑器集成(直接跳转到源代码)
- 多重编辑排队能力
- 集成终端,用于浏览器和代码侧边工作
- 响应式测试(带有可自定义的视口切换器)
- 参考图像支持(用于像素级精准提示)
用途と対象者
待编辑核验
入力待编辑核验
→出力待编辑核验
优点与缺点
优点
- 允许使用自然语言进行设计编辑,无需复制选择器。
- 集成强大的外部 AI 编码工具(Claude Code、Cursor、Gemini CLI)。
- 具有内置的响应式测试和视口自定义功能。
- 支持多重编辑排队,提高工作效率。
- 提供与首选代码编辑器的无缝集成。
缺点与限制
- 需要外部 AI 工具(Claude Code、Cursor 或 Gemini CLI)才能运行。
- 系统兼容性有限(macOS 13+ / Windows 10+)。
情報源
Design In The Browser編集部の参考資料
Toolify 公开资料利用前に確認
公式サイトで提供範囲、登録、上限、料金を確認し、小さなサンプルで試してください。
公開の公式情報に基づく基本情報です。商用条件、プライバシー、地域アクセス、制限は未確認です。
基本情報・追加確認待ち
確認範囲:名称、公式リンク、基本用途。
原情報源を見る
