Skip to main content
Kombai offers four distinct modes—Code, Plan, Debug, and Ask—that help you manage different stages of product development. Each mode has access to specialized tools and capabilities tailored to its specific purpose.
ModeForCapabilitiesTools
CodeDevelopmentGenerating, refactoring, and editing files.Access to all tools
PlanStrategyCreating implementation roadmaps.Read files, list directory, all search tools, all planning tools, all assets tools, all skills tools, all browser tools
DebugDebuggingDiagnosing and resolving complex frontend bugs.Access to all tools
AskExplorationAnswering questions and debugging logic.Read files, list directory, grep, web fetch, all skills tools, all browser tools

Code mode

Code mode is used to generate and refactor code. It is the default mode in Kombai, designed to help you autonomously perform complex coding tasks.

Working Set

Working Set refers to the set of files generated by Kombai during the code generation process. Kombai writes these files to your repository and automatically fixes any TypeScript and linting errors found in the generated code. You can view the generated files in the explorer or the Working Set panel. Click a file in the panel to open it in a new tab. If the file has been modified, you will see a diff comparing the modified version to the original. When you ask Kombai to modify generated code, it also checks for dependent files in the working set that may require updates. Kombai then proceeds to make the necessary changes and updates the working set.

Kombai diff

Kombai generates a diff for all files it creates, modifies, or deletes in the working set. This helps you easily track changes made to your repository.
Files in the working set can have three states: Added (A), Modified (M), or Deleted (D).Kombai determines the state of generated files by comparing them against:
  1. The initial state of the repository before Kombai generated any files
  2. The last time you clicked Keep
  3. Any external changes made since the kept version (e.g., user edits, terminal commands run by Kombai, or file edits by other AI agents)
For files appearing within a chat, the diff is compared against:
  1. The initial state of the repository before Kombai generated any files
  2. The most recent version of the file generated by Kombai

Undo and Keep

Code mode allows you to undo or keep generated code. After code is generated, the Undo and Keep buttons appear in the Working Set panel.
  • Undo: Reverts the repository changes to the last kept version. If there is no kept version, it reverts changes to the repository’s initial state (before Kombai started working on it).
  • Keep: Marks the current version as a checkpoint. Future diffs will be compared against this version.

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. Launch Kombai extension in your IDE.
  2. Click the mode dropdown in the chat input box.
  3. Select Plan.
  4. Add your task to the chat input box.
  5. Press Enter or click the
    button to send the task.
  6. Answer any clarifying questions.
  7. 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.

Debug mode

Debug is a specialized mode to diagnose 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:
StrategyDescription
LoggingTraces execution flow and variable states with structured console logs.
Component isolationRenders the suspect component on a dedicated test route, stripped of parent dependencies.
Mock API responsesReplaces real API calls with mock data to distinguish between frontend and backend issues.
Hardcode state and propsReplaces dynamic values with static data to test component logic in isolation.
Decompose to isolateBreaks down complex components into smaller, individual components to pinpoint the exact location of the issue.
Visual CSS debuggingAdds borders and background colors to visualize layout boundaries, spacing, and overflow issues.
Disable side effectsComments out hooks, callbacks, and lifecycle logic one at a time to identify problematic effects.
Trace async errorsAdds catch / throw blocks to surface promise failures.
Verify asset pathsUses curl to confirm that assets are being served correctly at the expected paths.
Force media query statesHardcodes responsive breakpoints and theme states to debug mobile/tablet and dark mode issues respectively.
Bypass routingRenders components outside the main router context to isolate routing-layer conflicts.

Ask mode

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

Switch between modes

You can switch modes at any time:
  1. Click the mode dropdown in the Kombai chat input box.
  2. Select the mode you want to switch to.
  3. Add your task to the chat input box.
  4. Press Enter or click the
    button to send the message.

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.

Tools

See the complete list of tools available in Kombai.