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 and Code to finalize the plan and start code generation.
The approve button shows the mode Kombai recommends for building the plan. To build it in Design mode instead, click the arrow beside the button and select Approve and Design. The Model dropdown next to the button sets the model that builds the plan.

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. From the plan card in chat or the plan preview, click Copy to copy the plan’s markdown, or Save to save it, including any edits you’ve made, as a Markdown file. The save dialog opens in your project folder.

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 and Code (or Approve and Design) 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 Restore at a checkpoint and choose what to roll back:Click Confirm in the dialog to restore. If Kombai is still working, restoring stops it first.
You can also resend an existing input to Kombai to generate a new response.
Resending a message works like Restore conversation and code: Kombai removes every message after it and reverts the file changes made since you first sent it.
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 in the Edit Message? dialog.

Answer clarifying questions

When Kombai needs more detail before it continues, it shows a Questions card above the chat input box. The card header shows how many questions you’ve answered, for example 1/3 answered. Click the arrow beside it to jump to the next unanswered question.
  1. For each question, select an option. Some questions accept more than one option.
  2. If none of the options fit, type your own answer in the Other (Type your answer…) field.
  3. Click Send once every question has an answer, or click Skip to continue without answering.

Mode switch suggestions

If your task suits a different mode, Kombai suggests switching with a card that names the mode and explains why, for example Switch to Design mode. Click the switch button (for example, Switch to Design) to change the chat’s mode, or click Decline to stay in the current one. Kombai continues the task either way.

Suggested next steps

After Kombai finishes a response, it may show a Suggested next steps card listing follow-up tasks, each tagged with the mode it runs in. Click a step to switch to that mode and add the step’s prompt to the chat input box. Review or edit the prompt, then send it.

Response actions

The row under Kombai’s latest response holds these actions:
  • Like response and Dislike response: Rate the response. Disliking it opens a box where you can say what went wrong.
  • Copy response: Copy the text of Kombai’s response.
  • Context usage: A ring that shows how much of the model’s context window the chat uses. Hover over it to see the exact share, for example ~42% of 200K tokens.
  • More actions ():
    • Compact thread: Compact the conversation.
    • Send feedback or Report issue: Send feedback or a bug report to the Kombai team.
    • Copy thread ID: Copy the chat’s ID, for example to include in a support request.
    • Credits used in thread: The total credits the chat has used so far.

Queued messages

What happens to a message you send while Kombai is working depends on the While the agent is working setting on the General tab of Settings:
  • Queue (default): The message waits until Kombai finishes, then goes out with any other queued messages.
  • Steer: The message joins the task in progress, and Kombai reads it at its next step.
Queued messages appear above the chat input box under an N Queued heading. Hover over a queued message to act on it:
  • Steer: Send the message into the task in progress instead of waiting for it to finish.
  • Delete: Remove the message from the queue and put its text back in the chat input box.
Steered messages appear below Kombai’s response until Kombai reads them. Click the icon beside one to stop Kombai and send it right away, or hover over it and click to delete it. If you change the model, mode, or thinking effort, or attach a Figma design, the message can’t join the response in progress. Kombai asks Send as a new message? instead. Click Stop and send to stop Kombai and send the message on its own, or Cancel to keep it where it was.
Queued messages also wait while Kombai is waiting on you, for example to approve a plan or answer questions.

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.