도구 소개
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 公开资料시작 전 확인
공식 사이트에서 제공 범위, 가입, 한도, 요금을 확인하고 작은 샘플로 테스트하세요.
공식 공개 정보에 기반한 프로필로 전체 실측은 하지 않았습니다. 상업 조건, 개인정보, 지역 접속, 제한은 추가 확인이 필요합니다.
기본 프로필 · 추가 확인 예정
확인 범위: 이름, 공식 링크, 기본 용도.
원문 출처 보기
