Integrate Claude Code into Cursor's Chat Panel
Position Claude Code inside Cursor's chat panel section for seamless AI coding alongside native features.
Cursor supports Claude Code as a sidebar extension, but positioning it in the chat panel section creates a unified AI coding experience.
Installation
Install Claude Code globally via Cursor’s integrated terminal (Cmd+J or Ctrl+J):
1
npm install -g @anthropic-ai/claude-code
After installation, authenticate by running claude in the terminal. Connect either your Anthropic API key or Claude Max plan subscription.
Move Claude Code to Chat Panel
Once installed, the Claude Code extension adds an icon to Cursor’s interface.
Step 1: Configure Activity Bar
Open Cursor settings via Command Palette (Ctrl+Shift+P / Cmd+Shift+P) and set Activity Bar orientation to “vertical”.
Step 2: Open in Sidebar
Use Command Palette (Ctrl+Shift+P / Cmd+Shift+P) and search for:
1
Claude Code: Open in sidebar
Step 3: Drag to Chat Panel
Click and drag the Claude Code icon from the sidebar directly into the chat panel area where you want it positioned.
Key Features in Chat Section
Once positioned, Claude Code operates alongside Cursor’s native chat:
- Real-time context selection: Select code blocks and Claude Code automatically includes them in context
- Integrated diff viewer: Accept or reject changes directly within Cursor’s interface
- File references: Use
@filenameor drag-and-drop files/folders for precise context control - Model switching: Toggle between Sonnet 4 (daily use) and Opus 4 (complex tasks) using
/modelcommand
Connection Management
Keep the IDE connected by typing /ide in Claude Code’s chat if the connection drops. A green circle indicates active connection.
Since Cursor is a VS Code fork, this integration works seamlessly with all Cursor features while giving you native access to Claude’s latest models.
Model Selection
Switch models based on task complexity:
| Model | Best For | Speed |
|---|---|---|
| Sonnet 4 | Daily coding tasks | Fast |
| Opus 4 | Complex refactoring | Slower |
Use /model command within Claude Code to switch between models.
Troubleshooting
Connection drops frequently:
- Check internet connectivity
- Run
/ideto reconnect - Restart the Claude Code extension
Extension not appearing:
- Verify installation with
claude --version - Reinstall with
npm install -g @anthropic-ai/claude-code - Restart Cursor completely
Chat panel positioning issues:
- Reset Cursor layout via
View > Reset Layout - Re-drag the extension icon to chat panel
☕ Support My Work
If you found this post helpful and want to support more content like this, you can buy me a coffee!
Your support helps me continue creating useful articles and tips for fellow developers. Thank you! 🙏