Skip to main content
Kombai runs as an agent that generates and refactors code autonomously whenever no mode is selected.

Select a mode

  1. Click the + icon in the chat input box, or type @ in the input.
  2. Under Modes, select the mode you want. It appears as a pill in the chat input, so you can always see which mode is active.
  3. Add your task to the chat input box.
  4. Press Enter or click the button to send it.
To leave a mode, click its pill. Kombai clears the pill and goes back to the default agent.

Design mode

Design is a specialized mode to generate beautiful UI designs. It comes with everything you need to manage the look and feel of your designs through a structured Design System covering colors, typography, spacing, and more. See the Design Mode overview for full details.

Plan mode

Plan mode generates a detailed implementation roadmap before code generation begins. Use this mode for complex frontend tasks and high-level planning.

Get started

  1. Click the + icon in the chat input box.
  2. Select Plan under Modes.
  3. Add your task to the chat input box.
  4. Press Enter or click the button to send the task.
  5. Answer any clarifying questions.
  6. Click Approve Plan to finalize the plan and start code generation.

Editable plan file

After reading your input and codebase, Kombai may ask clarifying questions. Based on your responses, it generates an editable plan containing sections like Design Plan, Technical Implementation, and To-dos. You can review and approve this plan to begin the code generation process.

Update the plan

  1. Click the icon in the top-right corner of the plan.md file.
  2. Click Edit to open the plan.md file in markdown.
  3. Make the required changes and save.
  4. Click Update Plan to regenerate the plan with your changes.
  5. Once the plan is updated, click Approve Plan to start code generation.

Ask mode

Ask is a read-only mode for codebase exploration or asking frontend-specific questions.

Debug mode

Debug is a specialized mode to detect and resolve complex frontend bugs. It provides a set of structured debugging strategies and automatically tracks any temporary debugging changes, so they can be reverted cleanly after the bug is fixed. Use Debug mode when a bug is hard to reproduce consistently, the root cause is unclear, multiple systems may be involved (e.g. API calls, state management, side effects, etc.), earlier fixes didn’t work, or you expect to introduce temporary changes to the codebase that must be cleaned up afterwards.

How it works

  1. Plan: Kombai reads your input and scans the relevant parts of the codebase, then proposes a debugging plan.
  2. Execute: After you approve the plan, Kombai applies its specialized debugging strategies to identify the root cause.
  3. Track: Kombai records every change in a debug changelog file in the .kombai folder.
  4. Verify: After implementing the fix, Kombai verifies the result using the browser tool or your feedback (for complex, reproducible bugs).
  5. Clean up: Kombai removes temporary debugging changes based on the debug changelog, leaving only the final fix.

Debugging strategies

Here are 11 debugging strategies that Kombai temporarily implements to diagnose the issue:

Restore chats across modes

Chats in Kombai can be restored at certain stages. This functionality works in all supported modes. There are two ways to restore:
Kombai provides a restore button at specific checkpoints: “after you send a message”, “after a plan is generated”, and “when the Continue button appears after you stop a response”.Click the restore button to restore the chat to that checkpoint.
You can also resend an existing input to Kombai to generate a new response.Follow the steps below to resend an input:
  1. Click on a previous input in the Kombai chat.
  2. Edit the input (optional).
  3. Press Enter and click Confirm.

Queued messages

Messages sent during active tasks are added to a queue and automatically sent to Kombai once the current task is complete. Queued messages appear above the chat input box. To force-send or delete a queued message, click the or icon beside it.
In Plan mode, queued messages aren’t automatically sent to Kombai unless you force-send them.

Todos

Kombai’s underlying logic analyzes your input and the relevant codebase to determine task complexity. For medium and advanced tasks requiring multi-step execution, Kombai generates a Todo checklist in the chat stream to serve as a roadmap for the implementation process. As Kombai executes the task, it verifies completed steps and applies a strikethrough to each item. This ensures the Todo list accurately reflects the current implementation status and remains aligned with your requirements.
Todos are only supported in the default agent and Debug mode.

Enhance prompts

The Enhance prompts feature improves the clarity, specificity, and overall effectiveness of your prompts before you send them to the agent. To use it, type your input in the chat window and click the icon to enhance your prompt. We recommend reviewing the enhanced prompt before sending, as the quality of enhancements may vary depending on the complexity of your request.