Claude Code in VS Code

Install and configure the Claude Code extension for VS Code. Get AI coding assistance with inline diffs, @-mentions, plan review and keyboard shortcuts.

The VS Code extension provides a native graphical interface for Claude Code directly inside VS Code.

With the extension you can:

• Review and edit Claude plans before accepting them
• Auto-accept edits
• Use @ mentions for files and line ranges
• Access conversation history
• Open multiple conversations in separate tabs or windows

---

Prerequisites

• VS Code 1.98.0 or higher
• An Anthropic account

TIP

You do not need to install the Claude Code CLI first.

Some advanced features such as MCP configuration still require the CLI.

---

Install the extension

Install directly:

• Install for VS Code
• Install for Cursor

Or manually:

1. Open Extensions with:

   • Cmd+Shift+X on Mac
   • Ctrl+Shift+X on Windows/Linux

2. Search for:

Claude Code

3. Click Install

TIP

You may need to restart VS Code or run Developer: Reload Window.

---

Get started

Open the Claude Code panel

You can open Claude Code in several ways:

Editor Toolbar

Click the Spark icon in the top-right corner of the editor.

Command Palette

Open:

• Cmd+Shift+P on Mac
• Ctrl+Shift+P on Windows/Linux

Search for:

Claude Code

Then select:

Open in New Tab

Status Bar

Click:

✱ Claude Code

in the bottom-right corner of VS Code.

---

Send a prompt

Ask Claude to help with:

• debugging
• explaining code
• refactoring
• generating code
• reviewing files

TIP

Select text in the editor and press Alt+K to insert an @ mention with file path and line numbers.

---

Review changes

When Claude wants to modify files, VS Code shows a diff preview.

You can:

• Accept changes
• Reject changes
• Request modifications

---

Customize your workflow

Change the layout

You can move the Claude panel to:

• Secondary sidebar (default)
• Primary sidebar
• Editor area

---

Switch to terminal mode

Enable terminal mode in VS Code settings:

Extensions → Claude Code → Use Terminal

Or open:

vscode://settings/claudeCode.useTerminal

---

Commands and shortcuts

Command	Shortcut
Focus Input	Cmd+Esc / Ctrl+Esc
Open in New Tab	Cmd+Shift+Esc / Ctrl+Shift+Esc
New Conversation	Cmd+N / Ctrl+N
Insert @ Mention	Alt+K

---

Configure settings

Open settings:

• Cmd+, on Mac
• Ctrl+, on Windows/Linux

Then go to:

Extensions → Claude Code

Important settings include:

• Selected Model
• Use Terminal
• Preferred Location
• Autosave
• Respect Git Ignore
• Disable Login Prompt

---

Use third-party providers

Claude Code can also work with:

• Amazon Bedrock
• Google Vertex AI
• Microsoft Foundry

Configure providers in:

~/.claude/settings.json

---

CLI vs VS Code extension

Feature	CLI	Extension
Slash commands	Full	Partial
MCP config	Yes	Partial
Terminal shortcuts	Yes	No

---

Security considerations

When auto-edit permissions are enabled, Claude can modify VS Code configuration files.

WARNING

Review changes carefully before accepting them.

For untrusted projects:

• Enable Restricted Mode
• Use manual approvals
• Disable auto-accept

---

Common issues

Extension will not install

• Verify VS Code version
• Check extension permissions
• Restart VS Code

---

Spark icon missing

Try:

1. Open a file first
2. Restart VS Code
3. Disable conflicting AI extensions
4. Check workspace trust

---

Claude does not respond

1. Check internet connection
2. Start a new conversation
3. Try the CLI:

claude

---

Uninstall the extension

1. Open Extensions
2. Search for Claude Code
3. Click Uninstall

Remove extension data:

rm -rf ~/.vscode/globalStorage/anthropic.claude-code

---

Next steps

• Explore workflows
• Configure MCP servers
• Customize Claude settings
• Connect external providers

---

Documentation source: https://code.claude.com/docs/llms.txt