在 VSCode 里，把你的想法变成真实 UI。
Powered by MyBricks
别再对着空白的 <div /> 发呆了。VibeUI 是你的 AI 界面设计师，直接住在你的 VSCode 里。你只需要描述想法，AI 帮你生成界面；你只需要拖拽微调，代码自动就绪。
"帮我做一个深色风格的数据看板，要有指标卡片和用户列表。"
告诉 AI 你想要什么，VibeUI 会立即为你生成可交互的 UI 界面。从布局到样式，AI 一步到位，灵感即刻落地。
生成的界面不完全满意？没关系。 直接在画布上拖拽、点击、修改属性。不用手写繁琐的 CSS，不用纠结 Flex 布局，像在设计工具里一样调整，但你操作的是真实的组件。
这不是一张图片，这是真实的代码。
- 设计文件：界面保存为
.ui文件，作为源码的一部分存入 Git。 - 一键导出：直接导出 React、Vue 或小程序代码，复制粘贴即用，或者直接引用。
- 安装插件：在 VSCode 插件市场搜索
VibeUI安装。 - 新建画布：新建一个
.ui文件，或者右键选择「用 MyBricks 打开」。 - 唤起 AI：在设计器内点击 AI 按钮，输入你的需求（Prompt）。
- Vibe 一下：看着 UI 在你眼前生成，然后根据需要微调。
- 导出使用：点击导出，获取代码。
为了体验完整的 AI Vibe 能力，你需要配置 MyBricks 平台的 Token