Design Mode - AI design engineer

Standout designs. Infinite canvas.

Generate creative UI designs shaped by curated inspirations, not generic AI defaults. Then refine them on an infinite canvas with visual edits, creative variations, and natural-language updates.

Get Started

We're adding new marketing design services: Posters & key art, Social & paid ads, Decks & one-pagers, Brand refresh kits and Motion & display.

Design a new page that showcases our creations prominently using examples from showcase.

I'll lock the visual direction first (inspiration, palette, type and layout), then build the page on canvas, leading with the work itself.

Fetched design inspirations
Generated images
Selected Colors & Visual Style
Chose Typography & Scale
Defined Layout & Spacing.

Direction locked. I'll spawn a design subagent to build the services page on canvas.

Spawning 1 subagent...

Created: Lusion Studio - Services

2 refinement passes completed

The page is live on lusion-studio-services.canvas: the electric-blue hero with BRANDS BUILT TO BE HEARD and the poster shelf, all five services set as press-run rows with their SVC codes, spec columns and barcodes, and the week's-run rail closing the page with showcase work.

The shelf posters settle in with a slight scatter and tilt so the hero reads as a working wall, and the rail loops continuously through the showcase, easing to a pause on hover. Everything is ready to wire up to the intake flow.

Memorable designs, made easy

Built-in creative references

Before starting to design, Kombai draws from a curated library of inspirations to build a unique creative strategy.

Bring your own inspirations

Use any website, Figma design, or image as a design reference. Guide the agent further with custom design.md files, rules, or skills.

Use handpicked style guides

Pick from a gallery of beautiful style-guides to give Kombai a visual direction of your choice. Use one as-is or customize it to create your own variation.

Generate stunning videos, images, and animations

Get assets that elevate your design, with the latest models like Veo, Seedance, Nano Banana, and more. Turn on high creativity for rich visuals and expressive animations.

I've got the layout from Figma, colors from your site, and tone from design.md. Now spawning a subagent to create the landing page design.

Created node: Landing Page - Final Variant

Generating 62%

Iterate on an infinite canvas

Make precise edits

Select any element in your design and directly edit its text and styles right inside the canvas.

Generate variations

Use built-in presets like "soften colors" or "increase content density," or write your own instructions to quickly explore different creative directions.

Update with natural language

Change and update your designs in natural language. Furthermore, add visual snippets or elements from a design to give the agent precise context.

Versions for all screens & modes

Generate versions optimized for different screens or light/dark modes. Send them to the agent for bulk updates or code generation.

From canvas to production

hero.canvas · 1 element selected

Runs in your repo Code Mode

Build for production with Code Mode

Kombai’s coding agent follows your stack, reuses components from your repo, and runs its own tests before handing the code back.

hero.canvas

Instant HTML copy or export

Styles and assets are built in, so the markup stands on its own. Use it as-is, or hand it straight to any agent.

One platform. Every Workflow.

Organize locally

Put the .canvas files in any folder structure you'd like. Add comments to your designs and notes on your canvases to share your thoughts.

Share canvases

Share .canvas files via slack, email or cloud. Anyone with Kombai extensions can open them as is.

Collaborate via git

Manage and collaborate on your design files via git, just as you would for your code files.

Questions? We've got answers.

What is Kombai?

Kombai is your AI design engineer. It helps you design and code standout websites and product UIs that don’t look like “AI slop”. Its taste agent makes high-quality design decisions for each task, instead of resorting to AI defaults. Its context tools find and reuse your existing design system, stack, tokens and components.

Explore designs on an infinite canvas, ship production-ready code in your real repo, and refine the result in an editable browser.

Does Kombai have a free plan?

Yes. Kombai offers a free plan of 300 credits per month. You can use this tier perpetually, or upgrade to one of our paid plans starting from $20/ month for heavier use.

Where is Kombai available?

Kombai is available as a desktop app and an extension for popular IDEs, including VS Code, Cursor, Antigravity, Trae, and Kiro. You can install it directly from these IDEs’ extension marketplaces or download it from the Open VSX Registry to install on any compatible IDE.

Does it generate designs or working code?

Both. Kombai can generate standalone designs on canvases (in “Design mode”) as well as create production-ready code in your codebase, using your stacks and coding patterns (in “Code mode”).

Can I import designs from Figma?

Yes. You can import Figma designs into Kombai via its native integration. Kombai can parse complex design files, fix common issues like messy grouping and invisible layers, and extract icons and assets. No MCP needed.

Can I use it with my existing codebase?

Yes. Kombai works as an IDE extension inside your codebase. It can understand the codebase and generate production-ready code that fits natively. Additionally, Kombai can also reuse components, hooks, utilities, and design tokens from your npm packages and storybooks via Context Graphs.

How can I share and export Kombai’s outputs?

Kombai writes all its outputs directly in your codebase. All these files can be shared with others or managed via git just as any other local files.

What stack does Kombai work with?

Kombai can work with any stack of your choice. It can automatically scan your repo, understand your stack and remember it persistently. In addition, it has built-in documentation and best practices for 400+ frontend specific tech stack libraries that it auto-applies for relevant coding tasks.

Design and code standout UI

Build standout websites and product UIs that fit in with your product and repo. Explore on a canvas, refine in the browser, ship production-ready code.