How to Use Claude Code Inside VS Code

Install the VS Code extension so Claude Code edits appear as inline diffs in the editor instead of only in the terminal.

7 minBeginner

Visit Claude Code

Claude Code works in the terminal, but pairing it with the VS Code extension shows proposed edits as native diffs right in the editor, with your current file and selection passed in as context. This guide installs the extension and runs a change from inside VS Code.

What you need

VS Code installed
Claude Code CLI installed and signed in
A project open in VS Code
About 6 minutes

Step 1: Install the extension

Open the Extensions panel, search for Claude Code, and install the official extension from Anthropic. It detects the CLI you already installed.

VS Code - Extensions

Extensions: Marketplace

Search: claude code

Claude Code - Anthropic [ Install ]

Status: CLI detected (v2.1.0)

The official Claude Code extension in the marketplace.

Step 2: Open the Claude panel

After installing, open the Claude Code panel from the sidebar or the command palette. Run the Open Claude Code command to dock a session next to your files.

Command Palette (Cmd/Ctrl+Shift+P)

> Claude Code: Open

Step 3: Ask for a change with the file in context

Select some code or just keep a file open, then type your request. The extension passes the active file and selection automatically, so you can refer to this function or the selected lines.

VS Code - Claude panel

Explorer

cart.ts

checkout.ts

utils.ts

src/cart.ts

1// selection: applyDiscount()

2// Claude: add input validation

3// so a negative percent is rejected

4function applyDiscount(total, pct) {

The open file and selection are passed as context.

Step 4: Review the inline diff

Edits appear as a native VS Code diff. Accept, reject, or keep refining, the same review loop as the terminal, but with full editor tooling around it.

The CLI and extension share state

The extension drives the same CLI underneath, so your CLAUDE.md, settings.json, and permissions all apply exactly as they do in the terminal. You do not configure anything twice.

Result: you get Claude Code's agent with VS Code's diff view, file tree, and search, which makes reviewing larger changes much easier than scrolling a terminal.