The Claude Code extension for VS Code

Claude Code is primarily a CLI: an agent that runs in your terminal. But Anthropic also ships a VS Code extension that puts Claude Code directly in your editor's sidebar. You launch the agent without leaving your file, and it has access to your open project.

Installing the extension

Open VS Code and go to Extensions (the square icon in the sidebar, or Ctrl+Shift+X). Search for Claude Code and install the official Anthropic extension.

The extension requires the Claude Code CLI to be installed on your machine first. If it is not, follow the Installing Claude Code lesson first.

Running Claude Code in VS Code

After installing the extension, you see a Claude icon in the left sidebar. Click it: it opens a panel with a chat interface.

Launch your first prompt from the extension. Claude Code sees your workspace (the files in the open project) and can read them, edit them, run terminal commands, and show you diffs before applying changes.

What you gain over the CLI alone

• Side-by-side diffs: when Claude proposes a change, the extension shows you the diff in the editor, not just in the terminal.
• Jump to a file with a click from the conversation: Claude mentions lib/content.ts:124, you click, you land on the line.
• Keep Claude visible while you code, without alt-tabbing to the terminal.
• Share screenshots: you can drag an image into the conversation, useful for showing a UI that needs fixing.

Antigravity as an alternative

If you use Antigravity instead of VS Code, the agent is already natively integrated. No extension to install: you have Claude (and its agentic variants) in the sidebar from the moment you install. The previous lesson VS Code or Antigravity covers the differences.