> ## Documentation Index
> Fetch the complete documentation index at: https://docs.coderabbit.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Plan with the VS Code extension

> Create, browse, and implement CodeRabbit Coding Plans directly from the VS Code extension, then hand off selected phases to your AI coding agent.

export const EnterprisePlanBadge = ({tip = "This feature is available exclusively as part of the Enterprise plan. Please refer to our pricing page for more information about our plans and features.", title = "Enterprise Plan", cta = "Read more", href = "https://coderabbit.ai/pricing", disabled = false}) => {
  return <Tooltip tip={tip} cta={cta} href={href}>
        <Badge icon="building-2" disabled={disabled || undefined}>
            {title}
        </Badge>
    </Tooltip>;
};

export const ProPlusPlanBadge = ({tip = "This feature is available as part of the Pro+ plan and Enterprise plan. Please refer to our pricing page for more information about our plans and features.", title = "Pro+ Plan", cta = "Read more", href = "https://coderabbit.ai/pricing", disabled = false}) => {
  return <Tooltip tip={tip} cta={cta} href={href}>
        <Badge icon="shield-plus" disabled={disabled || undefined}>
            {title}
        </Badge>
    </Tooltip>;
};

export const GitLabBadge = ({tip = "This feature is available on GitLab.", title = "GitLab", cta, href, disabled = false}) => {
  return <Tooltip tip={tip} cta={cta} href={href}>
        <Badge icon="gitlab" disabled={disabled || undefined}>
            {title}
        </Badge>
    </Tooltip>;
};

export const GitHubBadge = ({tip = "This feature is available on GitHub and GitHub Enterprise.", title = "GitHub", cta, href, disabled = false}) => {
  return <Tooltip tip={tip} cta={cta} href={href}>
        <Badge icon="github" disabled={disabled || undefined}>
            {title}
        </Badge>
    </Tooltip>;
};

<GitHubBadge tip="CodeRabbit Plan is available for GitHub repositories." /> <GitLabBadge tip="CodeRabbit Plan is available for GitLab repositories." /> | <ProPlusPlanBadge /> <EnterprisePlanBadge />

[CodeRabbit Plan](/plan) is now available directly in your editor. The **Plans** tab in the CodeRabbit sidebar lets you create agent-ready Coding Plans from a description and your workspace files, browse existing plans, and hand off selected phases to your AI coding agent, all without leaving VS Code.

<Note>
  These instructions are for VS Code. If you're using a VS Code-compatible editor
  like Cursor or Windsurf, the steps are similar but may require adaptation.
</Note>

## Requirements

* The [CodeRabbit VS Code extension](/ide/vscode-install) installed, and you are signed in to CodeRabbit.
* A Pro+ or Enterprise plan. Other plans see an upgrade prompt in the Plans tab.
* The repository open in your workspace must be installed in your CodeRabbit organization. If it isn't, the Plans tab links you to the repository settings so you can install it first.

## Create a plan

<Steps>
  <Step title="Open the Plans tab">
    Click the CodeRabbit icon in the VS Code activity bar, then select the
    **Plans** tab in the sidebar.
  </Step>

  <Step title="Describe what you want to build">
    Type a description of the feature, bug fix, or change in the composer at the
    bottom of the tab. Include goals, scope, and constraints. The more context
    you provide, the better the plan.
  </Step>

  <Step title="Reference workspace files (optional)">
    Type `@` or click the mention button to reference files and folders from
    your workspace. Referenced files are included as context, and folder
    references include the files inside them.
  </Step>

  <Step title="Attach supporting documents (optional)">
    Click the paperclip icon to attach PRDs, design specs, or screenshots.
    Supported formats include text, Markdown, CSV, JSON, PDF, and common image
    types, with up to 10 attachments of 5 MB each.
  </Step>

  <Step title="Create the plan">
    Click the send button or press <kbd>Cmd/Ctrl</kbd> + <kbd>Enter</kbd>.
    CodeRabbit analyzes your repository and generates the plan, showing each
    generation step in a progress timeline. The finished plan appears in the
    Plans list.
  </Step>
</Steps>

## Browse plans

The Plans tab lists the plans for the connected repository, newest first. Each entry shows the plan title, its status, the number of phases, and when it was created. Use the **Search plans** box to filter by title, and click any plan to open its details.

## Review plan details

The plan view shows everything CodeRabbit generated, in the same structure as the web app:

* **Summary**: An overview of the planned change.
* **Research**: Key findings from CodeRabbit's codebase analysis.
* **Assumptions**: The assumptions CodeRabbit made, with the chosen options and rationale.
* **Coding Plan**: The implementation phases. Expand a phase to see its description, task list, and the **AI prompt**, which you can copy for use with any agent.

See [Plan refinement](/plan/plan-refinement) for what each section contains.

## Implement a plan

<Steps>
  <Step title="Select phases">
    Check the phases you want to implement, or use **Select all**. Handing off
    one phase at a time often works better for complex plans.
  </Step>

  <Step title="Click Implement">
    Click the **Implement** button to send the selected phases' prompts to your
    configured AI coding agent: Copilot, Claude Code, Codex CLI, Devin,
    OpenCode, Cline, Roo, Kilo Code, Augment Code, or the clipboard as a
    fallback.
    Configure your preferred agent in [extension
    settings](/ide/vscode-config#configure-ai-agent-integration).
  </Step>
</Steps>

## Refine a plan on the web

Click **Iterate on Web** in the plan view to open the plan in the [CodeRabbit web app](https://app.coderabbit.ai/plan), where you can refine it through chat and collaborate with your team. When you return to the editor, the Plans tab picks up the updated plan.

This works in the other direction too: the **Send to IDE** option in the web app's [Agent Handoff](/plan/agent-handoff) opens the plan directly in your editor.

## What's next

<CardGroup cols={1}>
  <Card title="CodeRabbit Plan overview" href="/plan" icon="map" horizontal>
    Learn how Coding Plans work and the other ways to create them
  </Card>

  <Card title="Configure the extension" href="/ide/vscode-config" icon="settings" horizontal>
    Customize automatic review behavior and AI agent integration
  </Card>
</CardGroup>
