Kombai

什么是 Kombai？

Kombai 是面向团队和个人的 AI 设计工程师，可帮助设计网站和产品界面，并在不切换工具的情况下将这些设计转化为可投入生产的前端。该网站将其定位为端到端的前端工作流，使画布设计、渲染后的 UI 和仓库代码保持同步。

其核心目标是帮助用户在同一循环中从视觉概念走向可运行的 UI。产品网站强调基于画布的编辑、面向生产的代码生成以及浏览器上下文，让用户能够细化设计细节、在真实浏览器中检查结果，并将这些变更带回代码中。

Kombai 能做什么？

基于画布的可视化设计

在交互式画布上创建网站和产品 UI 概念，然后通过直接编辑元素进行细化，而不是从头重写提示词。

前端代码生成

在你现有的技术栈中生成可用于生产环境的前端代码，首页说明支持复用组件、tokens、hooks 以及代码库中的其他上下文。

设计-代码同步工作流

让设计与代码保持关联，这样你在画布、浏览器或代码仓库中的编辑都能在工作过程中同步。

感知浏览器上下文的编辑

使用浏览器上下文进行已渲染 UI 的编辑，并支持类似 DevTools 的检查、多标签页、截图、网络数据以及自动化测试/调试。

来自技术栈和来源的上下文

导入或引用设计系统、代码、Figma 文件、Storybook、npm 包，甚至网页，以便让新工作建立在现有上下文之上。

IDE 安装

在 IDE 扩展中工作，安装页面显示支持 VS Code 和其他受支持的编辑器。

使用场景

“设计到代码的页面创建”

在画布上设计落地页或产品页，然后无需切换到单独的交付步骤即可将其转化为可投入生产的前端。

“视觉 UI 迭代”

在浏览器中通过编辑文本、样式或布局来优化现有 UI，同时查看已渲染页面和相关浏览器上下文。

“在现有技术栈中构建”

在现有代码库中添加新界面时，复用仓库组件、hooks、tokens 和设计系统模式。

“视觉增强工作”

当页面需要的不只是简单的布局调整时，创建或调整精美资源、动画和视觉处理效果。

“团队前端工作流”

为需要集中使用、规则和 credits，同时又要协同交付前端工作的团队，设置共享访问和账单。

常见问题

Kombai 是什么？

Kombai 被定位为一款 AI 设计工程师，可帮助设计出色的网站和产品 UI，并在同一工作流中交付可直接上线的前端。

Kombai 有免费方案吗？

是的。定价页面包含免费方案，以及付费的 Pro、Team 和 Enterprise 方案。

我可以在哪里使用 Kombai？

Kombai 可在 VS Code 中使用，安装页面还列出了 Cursor、Antigravity IDE、Trae 和 Kiro。

Kombai 生成设计还是可运行的代码？

该网站将 Kombai 描述为同时处理设计和生产前端代码，并让两者保持同步。

我可以将它用于现有代码库吗？

可以。首页说明你可以基于现有代码库进行构建，安装页面则显示它可在 VS Code 中运行。