Claude Code in VS Code: install, connect an API key, use it

To use Claude Code in VS Code, install Anthropic's Claude Code extension from the Extensions view, then open it from the Spark icon in the editor's top-right corner. Sign in with a Claude plan, or add your API key and base URL to the claudeCode.environmentVariables setting. You need VS Code 1.94.0 or later.

What do you need?#

• VS Code 1.94.0 or later. Check your version under Help > About. Cursor and other VS Code forks can install the same extension.
• A way to pay for the model: an Anthropic Claude plan that includes Claude Code (Pro, Max, Ultra, Team or Enterprise), an Anthropic Console account, or an API key from a compatible service such as 5abeer.

How do I install the Claude Code extension?#

1. 1

   Open the Extensions view#

   Press Ctrl+Shift+X on Windows and Linux, or Cmd+Shift+X on macOS.

2. 2

   Search and install#

   Type Claude Code, pick the extension whose publisher is Anthropic, and click Install. Its ID is anthropic.claude-code, so you can also install it from a terminal:

   TerminalCopy

   code --install-extension anthropic.claude-code

3. 3

   Open a file#

   Open any file in your project. The Spark icon appears at the top right of the editor, and the extension is ready.

How do I open Claude Code in VS Code?#

Sign in with a Claude plan or connect an API key?#

With a Claude plan: click Sign in in the Claude Code panel and finish in your browser.

With an API key: requests go to the base URL you set and are billed per token to the key's owner, so plan limits don't apply to them. Create a key in your dashboard (how to create a key). These are the values Claude Code needs, shown as its settings file:

{
  "env": {
    "ANTHROPIC_BASE_URL": "https://api.5abeer.ai",
    "ANTHROPIC_AUTH_TOKEN": "YOUR_5ABEER_API_KEY",
    "ANTHROPIC_MODEL": "claude-sonnet-5.5"
  }
}

The extension checks for a key before it starts, and that check reads its own VS Code setting, claudeCode.environmentVariables. Values in ~/.claude/settings.json reach Claude Code once it runs, but not this check. So the key goes into VS Code's user settings:

1. 1

   Open your user settings#

   Press Ctrl+Shift+P (Cmd+Shift+P on macOS) and run Preferences: Open User Settings (JSON).

2. 2

   Add the variables#

   Add the claudeCode.environmentVariables entry. If the file already holds settings, keep them and separate the entries with commas.

   JSONCopy

   {
     "claudeCode.environmentVariables": [
       { "name": "ANTHROPIC_BASE_URL", "value": "BASE_URL" },
       { "name": "ANTHROPIC_AUTH_TOKEN", "value": "YOUR_5ABEER_API_KEY" }
     ]
   }

   Put the ANTHROPIC_BASE_URL value from the settings block above in place of BASE_URL, and your key in place of YOUR_5ABEER_API_KEY.

3. 3

   Reload and check#

   Save the file, run Developer: Reload Window from the Command Palette, and open Claude Code again. Send a short message. If a reply comes back with no sign-in screen, the key works, and the request shows in your dashboard under that key.

The extension and the terminal version share ~/.claude/settings.json, so keeping the same values there lets claude in any terminal use your key too. If the sign-in screen still appears, turn on Disable Login Prompt under Settings > Extensions > Claude Code (claudeCode.disableLoginPrompt).

How do you work with Claude Code in VS Code?#

Permission modes#

Switch modes from the prompt box:

• Manual: Claude asks before file edits and most shell commands. Each edit opens as a side-by-side diff with Accept and Reject.
• Plan: Claude reads and writes a plan, then waits for your approval before it changes anything.
• Edit automatically: Claude makes file edits without asking.
• Auto: a background classifier reviews most actions instead of asking you.

The claudeCode.initialPermissionMode setting picks the mode new conversations start in.

Give Claude context#

• Type @ and a file or folder name, such as @src/app.ts or @src/. Add a line range with @app.ts#5-10.
• Select code in the editor and press Alt+K (Option+K on macOS) to mention the file and the selected lines.
• Paste a screenshot into the prompt box, or hold Shift while you drag a file in.

Undo with checkpoints#

Hover over one of your earlier messages to rewind. Fork conversation from here branches the chat and keeps your files, Rewind code to here undoes Claude's file changes after that point, and Fork conversation and rewind code does both. Past sessions sit under the session history button.

Commands and shortcuts#

Type / in the prompt box to list the commands the extension supports, such as /model to switch models, /compact to shorten a long conversation, /status for the version, account and model, /mcp for MCP servers and /plugins for plugins.

Extension or the CLI in the terminal?#

You can use both on the same project:

To run the CLI inside VS Code, open a terminal from the Terminal menu and run claude. This needs the terminal install (Install Claude Code on Windows), because the extension's own copy isn't on your PATH. In a terminal outside VS Code, run /ide inside Claude Code to connect it to the editor, so its diffs open in VS Code's diff viewer and it sees your selection and the editor's errors. claude --resume can also pick up a conversation you started in the extension.

How do I fix common errors?#

• The extension won't install: check that VS Code is 1.94.0 or later and that you're allowed to install extensions, or install it from its Visual Studio Marketplace page.
• No Spark icon: open a file first, or use ✻ Claude Code in the Status Bar. If it's still missing, run Developer: Reload Window, turn off other AI extensions that may conflict, such as Cline or Continue, and check that the folder isn't in Restricted Mode.
• The panel is blank: update the extension, run Developer: Reload Window, then read the output of Claude Code: Show Logs.
• `'claude' is not recognized` in the terminal: the extension doesn't add claude to your PATH. Install the terminal version too.

Claude Code keeps asking you to sign in#

The extension found no key in its own setting. Check that claudeCode.environmentVariables sits in your user settings rather than a project's settings, and that the file is valid JSON. Then reload the window. If the sign-in screen still shows, turn on Disable Login Prompt. Starting VS Code from a terminal with code . also passes that terminal's variables to the extension.

If a request is refused with a code, INVALID_API_KEY means the key is wrong or deleted, and INSUFFICIENT_BALANCE means your balance doesn't cover the request. Every code is in Errors and fixes.

How do I run the extension with 5abeer?#

5abeer is an independent service compatible with the Anthropic Messages API, so the extension runs exactly as Anthropic ships it. Only the base URL and the key change.

• An API key, paid as you go. Pay per token from your balance, and give every key a spend limit, an expiry date and an IP allow-list (key controls). Claude prices are on the Claude API page.
• A 5abeer plan. The 5abeer AI app turns on Claude Code for your plan (what each plan runs). Plans are for the supported apps. To call the models from your own code, create an API key. See the pricing page and the Claude Code app page.

Every setting is explained on the Claude Code docs page.

Questions#

Does it work in Cursor and other VS Code forks?#

Yes. Cursor installs the same extension, and other VS Code forks can install it from the Open VSX Registry. Search for Claude Code in the editor's Extensions view and check that the publisher is Anthropic. In an editor that can't install it, run claude in its integrated terminal.

Do I need to install the Claude Code CLI too?#

No. The extension ships its own copy of Claude Code. Install the terminal version only if you also want to run claude in a terminal.

Does the extension cost anything?#

Installing it costs nothing. You pay for the model use: through your Claude plan, or per token on the API key you connect.

Can I undo what Claude changed?#

Yes. Hover over an earlier message and pick Rewind code to here. A Git commit before a large task is a second safety net.

Which model does it use?#

Start with the default model, claude-sonnet-5.5, which handles most coding tasks. Move to claude-opus-5.5 or claude-fable-5.1 for the hardest problems. Switch for the session with /model in the prompt box. To change the model new sessions start with, edit ANTHROPIC_MODEL in ~/.claude/settings.json. The full list with prices is on the models page.

How do I uninstall it?#

Open the Extensions view, find Claude Code and click Uninstall. Running claude in a VS Code terminal installs the extension again by default. To stop that, turn off Auto-install IDE extension in /config, or set CLAUDE_CODE_IDE_SKIP_AUTO_INSTALL=1.

Sources#

Checked on 2026-11-01:

• Claude Code docs: Use Claude Code in VS Code
• Claude Code docs: Connect Claude Code to an LLM gateway

Get started#

Install the terminal version with Install Claude Code on Windows, compare a Claude plan with an API key in The cheapest way to use Claude Code, or learn the basics in How to get an API key.