← All postsHow Do You Use Claude Code in VS Code?

How Do You Use Claude Code in VS Code?

Carlos GarciaCarlos GarciaPublished

How Do You Use Claude Code in VS Code?

Claude Code started life in the terminal, and plenty of guides still treat the VS Code extension as a thin wrapper around it. It is not.

The extension is a native graphical panel that Anthropic's own documentation calls the recommended way to use Claude Code in VS Code.

It is also not a complete replacement. A short list of features stays terminal-only, and the single most common setup complaint comes from assuming the extension put claude on your PATH. It does not.

This article covers what the extension adds, how to install and configure it, exactly which features the CLI keeps to itself, and the handful of problems worth knowing about before you hit them.

How Do You Use Claude Code in VS Code?

Install the extension from the Extensions view by pressing Ctrl+Shift+X on Windows or Linux, or Cmd+Shift+X on Mac, searching for "Claude Code", and clicking Install.

You need VS Code 1.94.0 or later and a paid Claude subscription or a Claude Console account. No API key is required.

Once installed, open the panel from the Spark icon in the editor toolbar, sign in through your browser, and start prompting.

Claude automatically sees the text you have selected and the file you have open.

The extension bundles its own private copy of the CLI for the chat panel, so it works immediately. Running claude in the integrated terminal is a separate install.

Shipping faster is only useful if the right people can find what you ship. Get a free audit to see where your site stands.

Free audit

Where do you stand in AI search?

A manual SEO + AI search audit of your site: how ChatGPT, Gemini, Perplexity and Claude read and cite it today, and what to fix first. Report within 48 hours, no credit card.

Get my free audit

Or have it all done: AI SEO services, $999 once

What Does the Extension Actually Add?

The value is not that Claude lives in a sidebar. It is that Claude can see what you are looking at and show you its changes in the editor's own diff view before anything is written.

Automatic Context From Your Selection

Claude reads your current selection and your open file without being told. That removes the constant copy-pasting that defines the terminal experience.

When you want a durable reference rather than ambient context, press Alt+K on Windows or Linux, or Option+K on Mac, to insert an @-mention such as @file.ts#5-10 with the exact line range you had highlighted.

Two settings govern this. attachOpenFile adds the open file to your messages, and attachSelection adds your selected text; both default to on, and turning them off leaves the manual @-mention route intact.

Reviewing Diffs Before They Land

In Manual mode, Claude shows a side-by-side comparison of the original and its proposed change and waits for permission. You can accept it, reject it, or say what to do differently.

You can also edit the proposed content directly in the diff before accepting.

Claude is told you modified it, so it does not go on assuming the file matches what it originally wrote, which is a genuinely thoughtful detail.

Reviewing one change at a time uses the Accept this change and Reject this change buttons under each hunk.

That requires Claude Code v2.1.275 or later, and a diff with more than 100 changes drops the per-change buttons and has to be reviewed whole.

Sessions, Tabs and Checkpoints

Conversations open as editor tabs, in the sidebar, or in separate windows, and you can run several at once. The Activity Bar's Spark icon lists past sessions.

Checkpoints work in the extension as they do in the CLI, so you can rewind. Sessions can be renamed, grouped, marked unread, and archived automatically after a set number of idle days via archiveInactiveSessions.

Crucially, the extension and the CLI share the same conversation history. Running claude --resume in a terminal opens a picker that includes conversations you started in the panel.

How Do You Install and Configure It, Step by Step?

  1. Check your VS Code version. Look under Help, then About. Anything older than 1.94.0 will not run the extension, and this is the first thing to rule out if it refuses to install.
  2. Install from the Extensions view. Press Ctrl+Shift+X or Cmd+Shift+X, search for "Claude Code", and click Install. You can also install straight from the Visual Studio Marketplace listing.
  3. Reload if nothing appears. Run "Developer: Reload Window" from the Command Palette. This resolves most cases where the extension installs but never shows up.
  4. Open the panel. Click the Spark icon in the editor toolbar at the top right, which appears when a file is open. The Status Bar entry at the bottom right works even with no file open.
  5. Sign in. Complete authorisation in the browser window that opens. If you have an API key set in your shell and still get prompted, launch VS Code from a terminal with code . so it inherits your environment.
  6. Choose where Claude lives. Set preferredLocation to panel for a new editor tab or sidebar to dock it on the right. This is the setting most worth getting right on day one.
  7. Decide how much Claude may do unasked. initialPermissionMode accepts default, plan, acceptEdits, or bypassPermissions. VS Code reads it from your user settings and ignores workspace values, which surprises people who try to set it per project.
  8. Leave autosave on. autosave defaults to on and saves files before Claude reads or writes them, which prevents Claude from working against a stale version of what is on your screen.
  9. Install the standalone CLI if you want a terminal too. The extension does not add claude to your PATH. Install it once and claude mcp add, claude --resume and the rest work in any terminal.
  10. Add the settings schema. Put "$schema": "https://json.schemastore.org/claude-code-settings.json" at the top of ~/.claude/settings.json for autocomplete and inline validation of every available setting.
  11. Learn one keyboard shortcut. Ctrl+Esc or Cmd+Esc toggles focus between the editor and Claude's prompt box. It is the shortcut that makes the panel feel native rather than bolted on.
  12. Check the extension's version number. The extension's version is the Claude Code version it bundles, so a feature gated at a given minimum needs at least that version of the extension. The Extensions view shows it.
Technical docs that nobody finds are an expensive way to write. Get a free audit and see what is holding your pages back.

When Should You Use the Extension Over the Terminal?

Use the extension when the work is editing code you are reading. Inline diffs and automatic selection context are worth more than anything the terminal offers for that specific loop.

Use it when you want several conversations in play. Separate tabs with named, grouped sessions beats juggling terminal panes.

Use the terminal when you need the full command surface. The extension exposes a subset of commands and skills, and typing / shows you which ones are available in your build.

Use the terminal for shell-heavy work. The ! bash shortcut and tab completion are both CLI-only, and the absence of the first is noticeable if you lean on it.

A reasonable default is both: the panel docked for editing, and the integrated terminal open with claude for anything the panel will not do. Nothing is lost in switching, because the history is shared.

What Are the Real Limitations?

The command set is a subset, not the whole thing. If a workflow depends on a specific slash command, check it exists in the panel before rebuilding your habits around it.

The ! bash shortcut and tab completion do not exist in the extension. Those are the two omissions most likely to send you back to the terminal mid-task.

claude is not on your PATH after installing. The bundled CLI is private to the chat panel, and a separate standalone install is required for terminal use.

Workspace trust blocks it. The extension does not work in Restricted Mode, which is an easy thing to overlook when you open an unfamiliar repository.

Other AI extensions can conflict. Anthropic's own troubleshooting suggests temporarily disabling extensions such as Cline or Continue when the Spark icon fails to appear.

Feature availability moves with the bundled version. Many capabilities carry a minimum version, so an older extension silently lacks them rather than telling you why.

Not sure whether your content is reaching developers at all? Get a free audit for a straight answer.

How Does It Compare to the Alternatives?

Against the Claude Code CLI, the extension wins on reviewing and editing code in place and loses on command coverage and shell ergonomics. They share history, so this is a per-task choice rather than a commitment.

Against GitHub Copilot's chat in VS Code, the difference is scope. Copilot is tuned around completion and conversation in the editor, while Claude Code is built as an agent that plans, edits across files and runs commands.

Against Cursor and other forks, there is no real contest to pick: the same extension installs in VS Code forks including Cursor, Devin Desktop and Kiro, from the Marketplace or the Open VSX registry.

Against editors that cannot install extensions, install the CLI and run claude in that editor's integrated terminal. The CLI works in any terminal, which is a cleaner fallback than most tools offer.

Frequently Asked Questions

The Spark icon is not showing. Why?

Open an actual file rather than just a folder, confirm VS Code is 1.94.0 or later, reload the window, and check the workspace is trusted. The Status Bar entry works without a file open.

Why does Cmd+Esc do nothing on my Mac?

On recent macOS versions the system Game Overlay shortcut claims Cmd+Esc first. Clear that checkbox under Keyboard Shortcuts, then Game Controllers, or rebind Claude Code: Focus input in VS Code's keyboard shortcuts editor.

Do I need an API key?

No. A paid Claude subscription or a Claude Console account is enough, and you sign in through the browser the first time you open the panel.

Can I keep using a conversation I started in the panel from the terminal?

Yes. Run claude --resume and pick it from the list, because both surfaces read the same conversation history.

Does it work with Amazon Bedrock or other providers?

Yes, with provider configuration. Anthropic documents a third-party provider setup path for Bedrock, Google Cloud's Agent Platform and Microsoft Foundry.

Final Thoughts

The VS Code extension is the better surface for the work most people actually do with Claude Code: reading code, proposing a change, and checking it before it lands.

Inline diffs and automatic selection context are the reason, and neither has a good terminal equivalent.

Treat the two surfaces as one tool with two front ends. Keep the panel for editing, keep a terminal ready for the commands the panel does not carry, and remember that the bundled CLI is not the same thing as having claude installed.

For the terminal side of the same tool, our guide on what the Claude Code CLI is and how to use it covers installation, updates and when the terminal is the right surface.

Want to know whether developers can actually find your documentation? Get a free audit.

Want this done for you?

SEO Stuff gets businesses cited by ChatGPT, Gemini, Perplexity and Claude, and ranking in Google. Start with the free audit, a call, or the package.

See where you stand

A free, manual SEO + AI search audit of your site, with a report within 48 hours. No credit card, no sales call.

Get my free audit

Talk it through

A free 15-minute call with the founder about whether AI search is a meaningful opportunity for your business.

Free strategy call

Have it done

The Done-For-You Package: audit, 10 pages of content, 3 DR50+ placements, dashboard. $999 once, delivered in 21 business days.

See the package