Adding MCP servers to VS Code

The short version

1. Open the Command Palette (Cmd/Ctrl + Shift + P) and run MCP: Add Server.
2. Choose Command (stdio) for a server that runs on your machine, or HTTP for a URL.
3. Enter the command, such as npx -y @playwright/mcp@latest, or the URL.
4. Give it a short ID, such as playwright, and choose where to save it: your user settings for every project, or the workspace to share it.
5. Accept the trust prompt, then ask Copilot in agent mode to do something with it, naming the server.

Every server page on MCP Shelf has a VS Code tab with the mcp.json block to paste.

The mcp.json format

The workspace file is .vscode/mcp.json. MCP: Open User Configuration opens the one in your user profile. Both list servers under "servers", and each entry says its type:

{
  "servers": {
    "playwright": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@playwright/mcp@latest"]
    },
    "context7": {
      "type": "http",
      "url": "https://mcp.context7.com/mcp"
    }
  }
}

Newer versions of VS Code also read a portable format shared with other Copilot tools: .mcp.json at the root of the workspace, or ~/.copilot/mcp-config.json for your user. That one uses "mcpServers", like Claude and Cursor. Check which file you are editing before you paste.

API keys without putting them in the file

In the VS Code format, an "inputs" entry makes VS Code ask for the key the first time the server starts and store it securely. Refer to it with ${input:id}:

{
  "inputs": [
    { "type": "promptString", "id": "firecrawl-key", "description": "Firecrawl API key", "password": true }
  ],
  "servers": {
    "firecrawl": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "firecrawl-mcp"],
      "env": { "FIRECRAWL_API_KEY": "${input:firecrawl-key}" }
    }
  }
}

This keeps .vscode/mcp.json safe to commit. Copilot sessions that read the portable format cannot prompt, so a server that relies on ${input:...} is not passed to them; use an environment variable there instead.

Copying a config from Claude or Cursor

1. Rename "mcpServers" to "servers".
2. Add "type": "stdio" to entries with a command, and "type": "http" to entries with a url.
3. Change ${env:NAME} placeholders only if you move the entry to the portable format, which uses ${NAME}.

VS Code can also pick up servers you already set up elsewhere. MCP: Add Server has an Add from another application option, and the chat.mcp.discovery.enabled setting can read Claude Desktop, Cursor and Windsurf configs; all but the Copilot CLI are off by default.

From the command line

The code command adds a server to your user profile in one line, which is handy for setup scripts:

code --add-mcp '{"name":"playwright","type":"stdio","command":"npx","args":["-y","@playwright/mcp@latest"]}'

When it does not work

• Run MCP: List Servers, pick the server and choose Show Output. Start-up errors and crashes show there.
• Pasted a Claude or Cursor block and nothing happened? Check the top-level key says "servers" in .vscode/mcp.json.
• A server whose tools changed still shows the old list: run MCP: Reset Cached Tools.
• Tools exist but Copilot never calls them: make sure you are in agent mode, check the server is ticked in the tools picker, and name the server in your prompt.
• At work, an organisation policy can limit which servers may run.

For the error messages themselves, see Fixing MCP server errors.

Popular servers to try in VS Code

Questions