Modes

Modes tune how Agent plans, which tools it prefers, and what context it prioritizes. Switch from the selector in the chat input, or press Shift + Tab.

Develop

Write, debug, and ship code.

Default mode for implementation — scaffolding from the canvas, refactors, bug fixes, and terminal work.

Add a settings section to this page matching the selected frame. Use existing form components.

Plan

Explore before you edit.

Use Plan when the task spans multiple files or needs discovery first. Agent researches the repo, asks clarifying questions, and returns a plan — then waits for approval before large edits.

Plan a billing upgrade flow. List files to touch, risks, and the order of changes.

Test

Verify behavior.

Test mode focuses on validation — typecheck, lint, test runners, DOM inspection, and design-tree checks against the canvas.

Run project checks and fix any errors from the last agent run.

Debug

Find root cause systematically.

Use Debug for failing builds, runtime errors, or flaky tests. Agent instruments and narrows before proposing a minimal fix.

Preview crashes after route change. Trace the error and propose the smallest fix.

Design

Refine UI on the canvas.

Design mode keeps Agent on layout, typography, and components — not production code. Iterate on mockups, then switch to Develop to implement.

Align spacing on this card with the rest of the canvas. Do not edit source files yet.

Inspiration

Capture reference UI from the web.

Inspiration mode enables site capture tools. Capture first, review on the Inspiration page, then switch to Develop before asking for code.

Capture the marketing page at example.com — I want to reference the hero layout.

The inspiration tool only runs in this mode.

Next steps

Chat

Prompt patterns and session tips

Inspiration

In-app URL and desktop capture

Tasks

Run mode-specific work from the board