Kombai

Kombai is an AI-powered tool designed to function as a design engineer for web and product interfaces. Its primary role is to assist users—typically designers, frontend developers, and product teams—in creating visually appealing website layouts and product UIs, and then automatically translating those designs into production-ready frontend code. The workflow is iterative and tightly integrated: users start by defining design concepts on a canvas, and Kombai generates corresponding HTML, CSS, and JavaScript code that can be directly used in development. The process supports real-time synchronization, meaning any changes made to the design on the canvas are reflected in the generated code, and vice versa. This allows designers to refine visual elements without breaking the codebase, and developers to adjust code without losing the design intent. Kombai provides a browser-based environment where users can interact with a live demo. For example, a user can request two distinct visual variants of a landing page for a premium Japanese knife atelier—one with a minimalist deep-charcoal theme and a full-bleed video hero showing the forge, and another with a warm paper-textured storybook aesthetic featuring a horizontal scroll collection. Kombai fetches design inspirations, generates relevant videos and images, and presents the variants on the canvas. The tool also supports commands like "/generate-video" to create full-bleed video hero sections, and it can pull in external assets to enrich the design. Behind the scenes, Kombai uses AI models that understand design principles, layout structures, and component hierarchies. It can interpret high-level design specifications—such as color palettes, typography, spacing, and responsive breakpoints—and produce code that adheres to mode