---
title: 'MCP: installation'
description: Connect Claude Code, Claude Desktop, Cursor, VS Code, Windsurf or any HTTP client to the Snaps MCP server.
---

The Snaps MCP server is a remote server over streamable HTTP:

```text
https://mcp.snaps.design/mcp
```

It authenticates with `Authorization: Bearer ass_…` using a key from [API keys](/api-keys). Each key is limited to 60 requests per minute. Replace `ass_…` in every snippet below with your key.

## Claude Code

```bash
claude mcp add --transport http snaps https://mcp.snaps.design/mcp \
  --header "Authorization: Bearer ass_…"
```

Run `claude mcp list` to check it connected.

## Claude Desktop

Claude Desktop starts local servers, so use the `mcp-remote` bridge to reach a remote one. Add this to `claude_desktop_config.json` (Settings, Developer, Edit Config):

```json
{
  "mcpServers": {
    "snaps": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "https://mcp.snaps.design/mcp", "--header", "Authorization:${AUTH_HEADER}"],
      "env": {
        "AUTH_HEADER": "Bearer ass_…"
      }
    }
  }
}
```

The whole header value, `Bearer` and key, goes in `env` and `args` reads it with no space after the colon, because some clients mangle spaces inside `args`. Restart Claude Desktop after saving. This needs Node.js installed.

## Cursor

Edit `~/.cursor/mcp.json` for all projects, or `.cursor/mcp.json` in a project. Cursor expands `${env:NAME}` in `url` and `headers`, so the key can stay in your shell environment:

```json
{
  "mcpServers": {
    "snaps": {
      "url": "https://mcp.snaps.design/mcp",
      "headers": {
        "Authorization": "Bearer ${env:APP_SS_KEY}"
      }
    }
  }
}
```

## VS Code

Create `.vscode/mcp.json` in the workspace. The top-level key is `servers`, not `mcpServers`. An input variable makes VS Code ask for the key once and keeps it out of the file:

```json
{
  "inputs": [
    {
      "type": "promptString",
      "id": "snaps-key",
      "description": "Snaps API key",
      "password": true
    }
  ],
  "servers": {
    "snaps": {
      "type": "http",
      "url": "https://mcp.snaps.design/mcp",
      "headers": {
        "Authorization": "Bearer ${input:snaps-key}"
      }
    }
  }
}
```

## Windsurf

Windsurf's Cascade reads `mcp_config.json`. Remote servers use `serverUrl`, and `${env:NAME}` is expanded in `headers`:

```json
{
  "mcpServers": {
    "snaps": {
      "serverUrl": "https://mcp.snaps.design/mcp",
      "headers": {
        "Authorization": "Bearer ${env:APP_SS_KEY}"
      }
    }
  }
}
```

:::note
The vendor's current documentation (which now calls the product Devin Desktop) puts the file at `~/.config/devin/mcp_config.json` on macOS and Linux and `%APPDATA%\devin\mcp_config.json` on Windows. Older Windsurf installs used `~/.codeium/windsurf/mcp_config.json`. Open the MCP settings panel in the app if you are unsure which your install reads.
:::

## Raw HTTP

The server is stateless, so you can test it with curl. This `initialize` call should return the server's name and capabilities:

```bash
curl -sS https://mcp.snaps.design/mcp \
  -H "Authorization: Bearer ass_…" \
  -H "Content-Type: application/json" \
  -H "Accept: application/json, text/event-stream" \
  -d '{
    "jsonrpc": "2.0",
    "id": 1,
    "method": "initialize",
    "params": {
      "protocolVersion": "2025-03-26",
      "capabilities": {},
      "clientInfo": { "name": "curl", "version": "0" }
    }
  }'
```

List the tools:

```bash
curl -sS https://mcp.snaps.design/mcp \
  -H "Authorization: Bearer ass_…" \
  -H "Content-Type: application/json" \
  -H "Accept: application/json, text/event-stream" \
  -d '{"jsonrpc":"2.0","id":2,"method":"tools/list"}'
```

A missing or wrong key returns HTTP 401 with a JSON-RPC error body.

## Troubleshooting

- **401:** the key is missing, mistyped or revoked. Create a new one.
- **429 or "rate limit":** more than 60 requests in a minute on one key. Wait a minute.
- **Tools do not show up in Claude Desktop:** check that `npx` runs in a terminal, then restart the app.