工具介绍
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 公开资料开始使用前，了解这些
先打开官方页面查看当前开放范围、注册要求、额度与套餐，用一份小样本验证它是否适合你的任务。
此档案依据官网公开资料整理，未做完整实测。商用授权、隐私条款、地区访问状态及功能限制尚待逐项核验。
基础档案 · 待进一步核验
核验范围：名称、官方入口和基本用途。
查看原始来源
