Skip to content
| Marketplace
Sign in
Visual Studio Code>AI>OpenCode PanelNew to Visual Studio Code? Get it now.
OpenCode Panel

OpenCode Panel

Haoyang Zeng

|
2,435 installs
| (2) | Free
OpenCode Panel: opencode-powered AI assistant with a modern React chat UI
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

OpenCode Panel

A React chat sidebar for AI coding in VS Code, powered by opencode. Bring your own model (Anthropic / OpenAI / Gemini / local). Everything runs locally — nothing leaves your machine except the API call to your chosen provider.

Panel overview
Chat panel
Model · Agent · Effort picker
Model · Agent · Effort picker
Chat history
Per-workspace chat history
Slash-command picker
Slash commands
Manage MCP servers
Manage MCP servers
Context-window usage
Context-window usage

Highlights

  • @file and @chat mentions — fuzzy file picker with chip-styled tokens and recently-opened files boosted; @chat pulls a past conversation into the prompt as context.
  • Image, PDF, and text attachments — paperclip or clipboard paste; images render as preview thumbnails, and about fifty code and plain-text extensions are accepted alongside images and PDFs.
  • Review Changes card per file with Keep / Undo per row and for all, SCM-style status badges, and attribution when a subagent made the edit. Undo locates each hunk by its line anchor before touching the file.
  • Edit + regenerate — click any past user message; the conversation rewinds via opencode's session.revert. A stopped reply offers Retry.
  • Model · Agent · Effort picker — one in-panel popover: search models grouped by provider, fold providers you do not use, pick from recent models, set the effort / reasoning budget for models that expose variants (gpt-5.5, claude-opus, etc.), and switch opencode agents.
  • Slash commands — /compact, /init, /undo, /redo, /fork, /new, and your workspace's custom opencode commands, from a picker that opens on /.
  • MCP servers and AI providers managed from the panel — /mcp adds local or remote servers and connects or authenticates them; /provider connects any provider opencode supports by API key or OAuth, and the model picker reflects the change on next open.
  • Chat history per workspace, including sessions started from the opencode TUI or another client in the same project; opening one makes it a regular conversation with edit and rewind.
  • Context-window usage ring in the composer — amber at 85%, red at 95%, hover for the token count against the model's limit.

Setup

OpenCode Panel talks to a locally-running opencode server. One-time prerequisite:

# Install opencode (pick one)
curl -fsSL https://opencode.ai/install | bash      # macOS / Linux
irm https://opencode.ai/install.ps1 | iex          # Windows
npm install -g opencode-ai                         # any platform
brew install sst/tap/opencode                      # macOS Homebrew

# Sign in to your provider (one time)
opencode auth login

OpenCode Panel works with opencode 1.x and, experimentally, with opencode 2.0. It reads the binary's version at startup and talks to each through its own API; nothing needs configuring. opencode 2.0 is a separate beta line with its own installers (curl -fsSL https://opencode.ai/v2/install | bash, npm install -g @opencode/cli, brew install anomalyco/tap/opencode-v2). On 2.0, sharing is not available yet. Set opencui.opencode2 to off to refuse 2.0 binaries.

Then install the extension:

code --install-extension haoyangzeng.opencui

Or search "OpenCode Panel" in the VS Code Extensions sidebar. Open the panel via the activity-bar icon or Cmd+L / Ctrl+L.

If opencode isn't on PATH, set opencui.binaryPath in settings to its absolute path.

Settings

Setting Default Description
opencui.binaryPath opencode Path to the opencode binary.
opencui.serverPort 0 Local opencode HTTP port (0 = auto).
opencui.model "" Default model (providerID/modelID). Change at runtime via the chat header.

Develop

bun install
bun run watch         # esbuild + vite single-file

Open the folder in VS Code and press F5 to launch an Extension Development Host.

License

MIT. See LICENSE.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft