How to Use Claude in VS Code | Installing the Extension and Getting Started

What Is Claude Code for VS Code — Official Extension with Built-in Diff Review

Claude Code for VS Code is an official VS Code extension distributed by Anthropic that puts a native GUI on top of the CLI version of Claude Code. The publisher on the Marketplace is Anthropic; as of writing in May 2026, the version is in the 2.1 series, and VS Code 1.98.0 or later is required (official documentation).

Installing the extension also bundles the CLI, so it connects seamlessly to advanced terminal-based workflows using the claude command. Anthropic itself states that using VS Code is "the recommended way to use Claude Code," and the same extension works in VS Code forks such as Windsurf and Kiro.

There is a separate article about Cursor, but this article focuses exclusively on stock VS Code. If you want to use Claude in Cursor, see Using Claude in Cursor.

Requirements — VS Code 1.98.0 or Later and an Anthropic Account

There are only two prerequisites to set up before installing.

1. VS Code 1.98.0 or later (check via Help → About)
2. An Anthropic account (Pro, Max, Team, or Enterprise subscription, or a provider configuration via Bedrock, Vertex AI, or Microsoft Foundry)

A free claude.ai account is not supported — you need a paid subscription (Pro or higher) or a provider configuration such as Bedrock or Vertex AI. This requirement applies to the CLI version as well; see Claude Code on Mac: Getting Started for more detail. Pricing plans are summarized in Claude Pricing Plans. You do not need to install Node.js separately — the extension ships with the binary bundled (official documentation).

Installation — Two Paths: One-Click Link or Extensions Search

Path A: Install via the One-Click Link (Fastest)

Open the VS Code-specific link vscode:extension/anthropic.claude-code by typing it directly into your browser's address bar. VS Code will launch automatically and show the Marketplace extension page — just click Install and you're done. This is the fastest path.

Path B: Search in the Extensions Panel

Open VS Code and follow these steps:

1. Open the Extensions panel with Cmd+Shift+X (Mac) or Ctrl+Shift+X (Windows/Linux)
2. Type "Claude Code" in the search box
3. Select the result published by Anthropic and click Install
4. If the Spark icon doesn't appear after installation, run "Developer: Reload Window" from the Command Palette

If the Marketplace is unavailable in a VS Code fork (Windsurf, Kiro, etc.), you can also get the extension from the Open VSX registry.

First Sign-In and the 4 Ways to Launch via the Spark Icon

After installation, opening the Claude Code panel for the first time shows a Sign in screen. Clicking the button takes you to a browser where you authorize with your Anthropic account, then returns you to the panel. The Spark icon (✦) is the entry point for the extension and can be accessed from these 4 locations:

1. Editor toolbar (upper right) — appears when a file is open; the fastest access point
2. Spark icon in the left Activity Bar — shows session history; always visible
3. Command Palette (Cmd+Shift+P / Ctrl+Shift+P) — search for "Claude Code"
4. "✱ Claude Code" in the status bar (lower right) — works even without an open file

If you have ANTHROPIC_API_KEY set in your shell but are prompted to sign in every time, launching VS Code from the terminal with code . will inherit the environment variable (official documentation).

Key Features — Diff Review, @-mentions, Plan Mode, and Checkpoints

These are the features that set the extension apart from the CLI.

Diff preview before applying changes: When Claude is about to edit a file, it shows a side-by-side before/after view and asks for approval. You can make adjustments directly in the diff view, and those changes are communicated to Claude before being applied.

Narrow context with @-mentions: Type @filename in the prompt field for fuzzy-matched file lookup, or pass a line range like @app.ts#5-10. Selected text in the editor is automatically included as context, and Option+K (Mac) / Alt+K (Windows/Linux) instantly inserts a line-numbered @-mention.

Plan mode: Switch to Plan using the mode toggle at the bottom of the prompt field, and Claude will present an implementation plan in Markdown without touching any real files until you approve. This is a key safeguard against unwanted changes — you can also write comments in the plan to give feedback.

Roll back with checkpoints: Hovering over any message in the conversation reveals a Rewind button with three options: "branch the conversation," "revert code only," or "revert both." This makes experimentation much safer when exploring different implementation approaches (official documentation).

Keyboard Shortcuts Reference

On macOS Tahoe or later, if Cmd+Esc doesn't respond, the system's Game Overlay shortcut is intercepting it. Go to Settings → Keyboard → Keyboard Shortcuts → Game Controllers and uncheck Game Overlay to restore the shortcut.

CLI vs. Extension — When to Use claude in the Terminal

The extension and the CLI share the same conversation history. A conversation started in a VS Code tab can be resumed seamlessly by running claude --resume in the built-in terminal, and /ide reconnects the CLI to the extension.

CLI-exclusive features — tab completion, shell shortcuts starting with !, and the MCP server command claude mcp add — are still run in the terminal. Conversely, the GUI diff review and Plan mode Markdown comments are exclusive to the extension. The practical setup is to use both together: use the extension for a broad overview, and the CLI for quick one-liners.

Troubleshooting — Spark Icon Missing, Repeated Sign-In, Extension Won't Install

Three common issues to close out.

1. Spark icon doesn't appear: Open a file and check again; verify VS Code 1.98+ via Help → About; temporarily disable competing AI extensions like Cline; disable Restricted Mode
2. Sign-in prompt keeps appearing: Launch VS Code from the terminal with code . to inherit environment variables, or sign in via your Anthropic account in the browser
3. Extension won't install: In VS Code forks (Windsurf, etc.), install from the Open VSX registry, or run claude directly in the built-in terminal

If none of these work, run "Developer: Reload Window" from the Command Palette, and as a last resort, file an issue with full details on GitHub Issues — that is Anthropic's recommended support channel. For a broader introduction to Claude Code, reading Claude Code: Getting Started and Claude Code on Mac together will give you a clear picture of how the CLI and the extension relate to each other.