Claude Code IDE Integrations

Claude Code integrates with multiple IDEs, editors, and surfaces to provide AI-assisted development directly in your workflow.

VSCode Extension

Installation

• Search "Claude Code" in Extensions (Cmd+Shift+X / Ctrl+Shift+X)
• Direct links: Install for VS Code, Install for Cursor
• Requirements: VS Code 1.98.0+ (check extension page for current minimum)

Core Features

• Native graphical interface: Dedicated panel in VS Code, draggable to sidebar, panel, or editor area
• Inline diff viewing: Side-by-side comparison before accepting
• Selection context: Shares selected text and open files automatically
• @-mention references: Tag files/folders with line numbers (@file.ts#5-10), supports fuzzy matching
• Permission modes: Normal, Plan Mode, Auto-Accept, Auto, Bypass Permissions
• Conversation history: Browse and resume past conversations (including remote sessions from claude.ai)
• Multi-tab support: Multiple conversations simultaneously in tabs or separate windows
• Checkpoints: Rewind file changes to any point in the conversation (fork, rewind code, or both)
• Plugin management: Install/manage plugins via /plugins in the prompt box
• Terminal output references: Reference terminal output with @terminal:name
• URI handler: Open Claude Code tabs from external tools via vscode://anthropic.claude-code/open

Keyboard Shortcuts

VSCode Settings

Built-in IDE MCP Server

When the extension is active, it runs a local MCP server that the CLI connects to automatically. This enables diff viewing in VS Code's native diff viewer, reading current selection for @-mentions, and executing Jupyter notebook cells.

Two tools are visible to the model:

The server binds to 127.0.0.1 on a random port with a fresh auth token per activation. Only the user running VS Code can connect.

JetBrains IDE Integration

Supported IDEs

• IntelliJ IDEA
• PyCharm
• Android Studio
• WebStorm
• PhpStorm
• GoLand

Installation

1. Install from JetBrains Plugin Marketplace
2. Search for "Claude Code"
3. Restart IDE after installation

Core Features

• Quick launch: Cmd+Esc (Mac) / Ctrl+Esc (Windows/Linux)
• Diff viewing: IDE's built-in diff viewer
• Selection sharing: Current selection automatically visible
• Diagnostic integration: IDE errors/warnings sent to Claude
• File references: Cmd+Option+K / Alt+Ctrl+K

Configuration

Navigate to Settings → Tools → Claude Code [Beta]:

• Claude command: Custom path (e.g., claude, /usr/local/bin/claude, or npx @anthropic/claude)
• Suppress notifications: Hide warnings
• Auto-update: Check for plugin updates
• Enable Option+Enter for multi-line (macOS): Option+Enter inserts new lines in prompts

Remote Development: Install the plugin on the remote host via Settings → Plugin (Host), not on your local client.

WSL: Set wsl -d Ubuntu -- bash -lic "claude" as your Claude command. See WSL troubleshooting guide for networking configuration.

ESC Key Fix

If ESC doesn't interrupt Claude:

1. Settings → Tools → Terminal
2. Uncheck "Move focus to the editor with Escape", or click "Configure terminal keybindings" and delete the "Switch focus to Editor" shortcut

Vim/Neovim Integration

Enabling Vim Mode

• Command: /vim to toggle
• Persistent: Configure via /config

Vim Mode Shortcuts

Mode Switching:

Navigation (NORMAL mode):

• Movement: h/j/k/l
• Words: w (next), e (end), b (previous)
• Line: 0 (start), $ (end), ^ (first non-blank)
• Document: gg (top), G (bottom)
• Jump: f{char}, F{char}, t{char}, T{char}

Editing (NORMAL mode):

• Delete: x, dd, dw/de/db
• Change: cc, cw/ce/cb
• Yank: yy/Y, yw/ye/yb
• Paste: p (after), P (before)
• Indent: >>/<<
• Repeat: .

Text Objects:

• iw/aw - Inner/around word
• i"/a" - Inner/around quotes
• i(/a( - Inner/around parentheses
• i{/a{ - Inner/around braces

Chrome/Browser Integration

Status: Beta. Works with Google Chrome and Microsoft Edge. Not yet supported on Brave, Arc, or other Chromium-based browsers. WSL is not supported.

Prerequisites

• Google Chrome or Microsoft Edge
• Claude in Chrome extension (v1.0.36+)
• Claude Code v2.0.73+
• Direct Anthropic plan (Pro, Max, Team, or Enterprise). Not available via Bedrock, Vertex, or Foundry.

Setup

claude --chrome

Verify with /chrome command. To enable by default without --chrome flag, run /chrome and select "Enabled by default".

In VS Code, Chrome is available whenever the extension is installed. Use @browser in the prompt box:

@browser go to localhost:3000 and check the console for errors

Capabilities

• Live debugging: Read console errors and DOM state, then fix the code that caused them
• Design verification: Build UI from a Figma mock, then verify in browser
• Web app testing: Form validation, visual regressions, user flows
• Authenticated web apps: Interact with Google Docs, Gmail, Notion (shares browser login state)
• Data extraction: Pull structured info from web pages into local files
• Task automation: Multi-site workflows, form filling, data entry
• Session recording: Record browser interactions as GIFs

Desktop App

The Claude Desktop app provides Claude Code through a native graphical interface with capabilities beyond the CLI and VS Code extension.

Installation

Download from claude.com/download. Available on macOS and Windows.

Key Features

• Visual diff review: Inline comments on diffs with multi-round feedback before committing
• Live app preview: Embedded browser for dev servers with auto-verification of changes
• Computer use: Control native apps and your screen (macOS/Windows, Pro/Max plans, research preview)
• GitHub PR monitoring: CI status tracking with auto-fix and auto-merge toggles
• Parallel sessions: Automatic Git worktree isolation for concurrent work
• Dispatch integration: Send tasks from your phone, get a session on Desktop
• Scheduled tasks: Run Claude on a recurring schedule
• Connectors: GitHub, Slack, Linear, and more
• Multiple environments: Local, SSH, and cloud (remote)

Permission Modes

The dontAsk mode is CLI-only and not available in Desktop.

Computer Use

Computer use lets Claude open apps, control your screen, and interact with GUIs. It is the broadest but slowest tool, used only when connectors, Bash, and Chrome can't handle the task.

App permission tiers (fixed by category):

CLI Comparison

Claude Code on the Web

Status: Research preview.

Claude Code on the web lets developers run Claude Code tasks asynchronously on secure Anthropic-managed cloud infrastructure, accessible from claude.ai/code and the Claude mobile app (iOS/Android).

Availability

• Pro, Max, Team, and Enterprise users
• Enterprise users need premium seats or Chat + Claude Code seats

Key Features

• Asynchronous execution: Start tasks and close your laptop; work continues in the cloud
• Diff view: Review changes file by file with inline commenting before creating PRs
• Auto-fix PRs: Claude watches PRs, automatically fixes CI failures and review comments
• Terminal-to-web: Start cloud sessions from CLI with claude --remote "task description"
• Web-to-terminal: Pull web sessions to local with /teleport or claude --teleport
• Parallel tasks: Run multiple --remote sessions simultaneously
• Scheduled tasks: Recurring automation (daily PR reviews, dependency audits, CI failure analysis)
• Session sharing: Share sessions with team members (Team/Enterprise) or publicly (Pro/Max)
• Mobile access: Kick off tasks and monitor progress from iOS/Android

Cloud Environment

Sessions run in isolated Anthropic-managed VMs with:

• Pre-installed languages: Python, Node.js, Ruby, PHP, Java, Go, Rust, C++
• Databases: PostgreSQL 16, Redis 7.0
• Package managers: pip, poetry, npm, yarn, pnpm, bun, gem, bundler, cargo, Maven, Gradle
• Configurable network access: Limited (default allowlist), Disabled, or Full
• Setup scripts for custom dependency installation
• GitHub proxy for secure git operations with scoped credentials

Network Access

Three levels:

• Limited (default): Allowlisted domains only (package registries, cloud platforms, git hosts)
• Disabled: No internet (Anthropic API still accessible)
• Full: Complete internet access

Workflow Patterns

Plan locally, execute remotely:

# Plan in local terminal
claude --permission-mode plan

# Execute in cloud
claude --remote "Execute the migration plan in docs/migration-plan.md"

Teleport sessions:

# Interactive picker
claude --teleport

# Specific session
claude --teleport <session-id>

# From within Claude Code
/teleport

Limitations

• GitHub-hosted repositories only (including GitHub Enterprise Server for Team/Enterprise)
• GitLab and other non-GitHub repositories not supported
• Session handoff is one-way (web-to-terminal only, not terminal-to-web for existing sessions)
• Shares rate limits with all other Claude usage on your account

Terminal Keyboard Shortcuts

General Controls

Text Editing

Multiline Input

• Shift+Enter (iTerm2, WezTerm, Ghostty, Kitty)
• Option+Enter (macOS Terminal with Option as Meta)
• \ + Enter (works everywhere)
• Ctrl+J (line feed alternative)

Bash Mode

Prefix with ! to run bash directly: ! npm test

Best Practices

Context Efficiency

• Use specific @-mentions rather than entire folders
• Enable .gitignore respect
• Leverage MCP servers for external tools

File Organization

• Create CLAUDE.md with project guidelines (see /init)
• Use git worktrees for parallel sessions
• Reference specific line ranges: @file.ts#5-10

Permission and Safety

• Use Plan Mode (Shift+Tab) to review changes
• Enable manual approval for sensitive operations
• Configure hooks for validation

Terminal Setup

Configure Shift+Enter for multiline input:

iTerm2: Settings → Profiles → Keys → Set Option key to "Esc+"

Terminal.app: Settings → Profiles → Keyboard → Check "Use Option as Meta Key"

Session Management

• Name sessions: /rename <name>
• Resume conversations: /resume
• Switch between extension/CLI: --resume

Troubleshooting

VSCode Spark Icon Not Visible

• Ensure VS Code meets minimum version requirements
• Open a file (folder alone won't show icon)
• Restart with "Developer: Reload Window"

JetBrains Plugin Not Working

• Completely restart IDE
• Verify plugin installed correctly
• For WSL: Check networking configuration

Chrome Integration Issues

• Update Claude Code: claude update
• Verify Chrome or Edge is running and visible
• Run /chrome and select "Reconnect extension"
• First-time setup requires Chrome restart to pick up native messaging host config
• If service worker goes idle during long sessions, run /chrome and reconnect

Keyboard Shortcuts Not Working

• Press ? to see available shortcuts
• Verify Option/Alt key configuration
• Check for conflicting IDE shortcuts
• Run /terminal-setup

Sources

• VS Code Integration
• JetBrains Integration
• Desktop App
• Desktop Quickstart
• Claude Code on the Web
• Chrome Integration
• Interactive Mode & Shortcuts
• Terminal Configuration
• Permission Modes