How to Set Up Claude Desktop with MCP Servers (2026 Guide)

Most developers install Claude Desktop, use it as a chat window, and stop there. That is about 20% of what the app can do. The other 80% opens up once you connect MCP servers: small programs that give Claude direct access to your files, GitHub repos, databases, web search, and visual tools like screenshot APIs.

This guide walks you through the full setup, from installation to a working MCP stack you can use on real projects. By the end, you will have Claude Desktop connected to the tools you actually use, instead of copy-pasting everything into a chat box.

What you will learn:

• How to install Claude Desktop on macOS, Windows, and (sort of) Linux
• Where the MCP config file lives and how to edit it
• What MCP servers are and how they work in practice
• The 8 most useful MCP servers for developers, with copy-pasteable config snippets
• How to use Desktop Extensions for one-click installation
• How to connect to remote MCP servers with OAuth
• How to troubleshoot the most common setup problems

Already have Claude Desktop installed? Skip to Section 4: Setting Up Your First MCP Server for the config snippets.

---

Table of Contents

1. Installation
2. First-Time Configuration
3. What Are MCP Servers?
4. Setting Up Your First MCP Server
5. The 8 Best MCP Servers for Developers
6. Desktop Extensions: One-Click Installation
7. Remote MCP Servers
8. Troubleshooting Claude Desktop MCP Issues
9. Recommended Starter Stack
10. FAQ: People Also Ask

---

1. How to Install Claude Desktop

Claude Desktop is Anthropic's native app for macOS and Windows. Download it from claude.com/download.

macOS: Download the .dmg file, drag Claude to your Applications folder, and launch it. Both Intel and Apple Silicon Macs are supported natively.

Windows: Download the installer for your architecture (x64 or ARM64). Run the .exe and follow the prompts. Claude will appear in your Start menu.

Linux: Anthropic does not ship an official Linux build. Community packages exist through projects like claude-desktop-debian, which repackages the Windows build into .deb and .AppImage formats that run without Wine. These are not officially supported. If you are on Linux, Claude Code (the CLI) has full MCP support and is the better option.

After installation, sign in with your Anthropic account. You need at least a Pro subscription ($20/month) for full usage, though a free tier exists with limited messages per day.

2. Claude Desktop First-Time Configuration

Once signed in, click your profile icon in the bottom-left corner and open Settings.

Model selection: Choose your default model. Claude Sonnet 4.6 is the recommended daily driver for development work: fast, capable, and efficient on your quota. Claude Opus 4.7 is the most capable model but uses more quota per message. You can switch models per-conversation at any time.

Privacy: Under "Data," review what Anthropic stores. If you work with sensitive code, disable conversation history storage. Note that this means you lose access to past conversations.

Theme: Dark or light. Picks up your system setting by default.

Developer settings: This is where MCP configuration lives. Go to Settings > Developer and click "Edit Config." This opens claude_desktop_config.json in your default editor and creates the file if it does not exist.

The config file location varies by OS:

• macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
• Windows: %APPDATA%\Claude\claude_desktop_config.json
• Linux: ~/.config/Claude/claude_desktop_config.json

This JSON file is where you define every local MCP server Claude should connect to. The next sections show you exactly what to put in it.

Note for Windows MSIX installs: If you installed Claude Desktop via the Microsoft Store or WinGet, the config file may be at C:\Users\YourName\AppData\Local\Packages\Claude_pzs8sxrjxfjjc\LocalCache\Roaming\Claude\. Use the Settings > Developer > Edit Config shortcut to open the correct file automatically.

3. What Are MCP Servers and Why Do They Matter?

MCP (Model Context Protocol) is an open standard that lets AI applications connect to external data sources and tools through a single, consistent interface. Think of it as USB for AI: one protocol, many devices.

An MCP server is a small program that runs locally (or remotely) and exposes "tools" to Claude. When you ask Claude to do something that requires an external tool, like searching GitHub or taking a screenshot of a URL, it calls the appropriate MCP server behind the scenes. You approve the tool call, the server executes it, and the result flows back into the conversation.

Why this matters for developers:

• File access: Claude can read and write your project files instead of you copy-pasting code into the chat
• Live web search: Claude can look up current documentation instead of relying on training data
• GitHub integration: Claude can review PRs, create issues, and search code directly
• Database queries: Claude can help debug data issues by querying your database
• Visual capture: Claude can see what websites look like through screenshot APIs, catching layout bugs a text-only model would miss

Without MCP servers, Claude is limited to the text you paste into the chat window. With them, it becomes a connected assistant that can reach into your actual development environment.

4. Setting Up Your First MCP Server

Let's start with the GitHub MCP server since most developers already have a GitHub account and a personal access token.

Prerequisites: Docker Desktop must be installed and running. The official GitHub MCP server is distributed as a Docker image.

Step 1: Create a GitHub Personal Access Token at github.com/settings/tokens. Select "Fine-grained token," grant repo and read:org scopes, and copy the token.

Step 2: Open your claude_desktop_config.json (Settings > Developer > Edit Config) and add the following:

{
  "mcpServers": {
    "github": {
      "command": "docker",
      "args": [
        "run", "-i", "--rm",
        "-e", "GITHUB_PERSONAL_ACCESS_TOKEN",
        "ghcr.io/github/github-mcp-server"
      ],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_your_token_here"
      }
    }
  }
}

Step 3: Quit Claude Desktop completely (Cmd+Q on macOS, not just closing the window) and relaunch it. Claude needs a full restart to pick up config changes.

Step 4: Open a new conversation. You should see a tools indicator (a small hammer or slider icon) near the message input. Click it to confirm the GitHub tools are listed.

Try it out: ask Claude "What are the open issues in my-org/my-repo?" and watch it call the GitHub MCP server to fetch the answer.

If the tools do not appear, check Section 8: Troubleshooting. The most common issue is malformed JSON in the config file.

5. The 8 Best MCP Servers for Developers

Here are eight MCP servers that cover the most common developer workflows. You can add all of them to a single claude_desktop_config.json file. The full combined config is at the end of this section.

5.1 GitHub MCP Server

What it does: Full GitHub integration. Search repos, read files, create and review PRs, manage issues, browse commits. This is the official server maintained by GitHub.

Why you want it: Code review, issue triage, and repo exploration happen directly in the conversation, without switching to a browser.

"github": {
  "command": "docker",
  "args": [
    "run", "-i", "--rm",
    "-e", "GITHUB_PERSONAL_ACCESS_TOKEN",
    "ghcr.io/github/github-mcp-server"
  ],
  "env": {
    "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_your_token_here"
  }
}

Setup: Requires Docker Desktop and a GitHub PAT with repo and read:org scopes.

5.2 Brave Search

What it does: Web search through the Brave Search API. Claude can look up current documentation, find Stack Overflow answers, or research any topic in real time.

Why you want it: Claude's training data has a cutoff. When you need information about a library released last month or a bug reported last week, Brave Search fills the gap.

"brave-search": {
  "command": "npx",
  "args": ["-y", "@modelcontextprotocol/server-brave-search"],
  "env": {
    "BRAVE_API_KEY": "your_brave_api_key_here"
  }
}

Setup: Sign up at brave.com/search/api and generate an API key. Brave provides $5 in monthly credits (approximately 1,000 queries) on every account; usage beyond that is billed per query.

5.3 Context7

What it does: Serves up-to-date, version-specific library documentation directly to Claude. Instead of generating code based on stale training data, Claude fetches the exact docs for the version you are using.

Why you want it: If you have ever had Claude generate code using a deprecated API because it was trained on older docs, Context7 fixes that problem.

"context7": {
  "command": "npx",
  "args": ["-y", "@upstash/context7-mcp@latest"]
}

Setup: No API key required for basic usage. For higher rate limits, create a free key at context7.com/dashboard and set CONTEXT7_API_KEY in the env block. Requires Node.js 18+.

5.4 Filesystem

What it does: Gives Claude read and write access to directories on your machine. It can list files, read contents, search by name or content, and write changes.

Why you want it: Instead of copy-pasting files into the chat, point Claude at your project directory and let it read what it needs. Useful for code reviews, refactoring, and generating new files in the right location.

"filesystem": {
  "command": "npx",
  "args": [
    "-y", "@modelcontextprotocol/server-filesystem",
    "/Users/you/projects",
    "/Users/you/Documents"
  ]
}

Setup: No API key needed. The paths in args (after the package name) define which directories Claude can access. Add or remove paths as needed. Claude will ask for your approval before any file operation.

Security note: Only expose directories you are comfortable with Claude reading. Do not point it at your home directory root or any folder containing secrets like .env files or SSH keys.

5.5 Playwright

What it does: Browser automation. Claude can navigate to pages, click elements, fill forms, take screenshots, and extract content from rendered web pages. This is Microsoft's official MCP server built on the Playwright testing framework.

Why you want it: Testing web apps interactively. Claude can walk through a user flow, fill out a form, click submit, and tell you what happened. Useful for debugging frontend issues or verifying that a deploy worked.

"playwright": {
  "command": "npx",
  "args": ["-y", "@playwright/mcp@latest"]
}

Setup: Requires Node.js 18+. On first run, you may need to install browser binaries with npx playwright install. No API key needed.

5.6 SnapRender

What it does: Screenshot API for the web. Claude sends a URL and gets back a rendered screenshot (PNG, JPEG, WebP, or PDF) of that page. Supports device emulation (iPhone, Pixel, iPad), dark mode, full-page captures, ad blocking, and cookie banner removal.

Why you want it: Claude is a multimodal model that can analyze images, but it cannot see what a website looks like on its own. SnapRender gives it visual capture. Ask "does our landing page look right on mobile?" and Claude will screenshot the page, analyze the image, and point out layout issues. Also useful for visual regression testing, OG image validation, and monitoring competitor pages.

Where it falls short: SnapRender captures static screenshots, not interactive sessions. If you need Claude to click through a multi-step flow (login, fill form, submit), use Playwright instead. SnapRender is better for quick visual checks, device-specific captures, and anything where you need a clean screenshot without running a local browser.

"snaprender": {
  "command": "npx",
  "args": ["-y", "snaprender-mcp"],
  "env": {
    "SNAPRENDER_API_KEY": "sk_live_your_key_here"
  }
}

Setup: Sign up at snap-render.com for a free API key (200 screenshots/month, no credit card required). Copy the key from your dashboard at app.snap-render.com/dashboard. Paid plans start at $9/month for 2,000 screenshots. SnapRender also supports a remote MCP server with OAuth (covered in Section 7).

5.7 Figma

What it does: Reads design data from Figma files. Claude can inspect components, variables, layout properties, and generate code from selected frames.

Why you want it: Bridging design and code. Point Claude at a Figma frame and ask it to build the component. It reads the design tokens, spacing, and typography directly from the file instead of you manually translating the design.

Figma offers both a remote server (recommended) and a local desktop server. The remote server is the simplest to set up:

1. In the Claude Desktop chat box, click the + icon
2. Go to Connectors > Browse Connectors
3. Search for "Figma" and add it
4. Authenticate with your Figma account when prompted

For the local desktop server (requires Figma Desktop app with Dev Mode), open a Figma Design file, switch to Dev Mode, and enable the MCP server in the right sidebar. Copy the URL it provides and configure it as a Streamable HTTP endpoint. See Figma's MCP documentation for the latest setup steps.

5.8 Supabase

What it does: Direct access to your Supabase project. Claude can run SQL queries, list tables, apply migrations, generate TypeScript types from your schema, and fetch logs.

Why you want it: Database debugging without leaving the conversation. Ask Claude "why are users seeing duplicate rows in the orders table?" and it can query the database, inspect the schema, and find the problem.

"supabase": {
  "command": "npx",
  "args": [
    "-y", "@supabase/mcp-server-supabase@latest",
    "--read-only",
    "--project-ref=your-project-ref"
  ],
  "env": {
    "SUPABASE_ACCESS_TOKEN": "sbp_your_personal_access_token"
  }
}

Setup: Generate a Personal Access Token from your Supabase dashboard. Replace your-project-ref with your project's reference ID (found in your project settings URL). The --read-only flag is strongly recommended unless you specifically need write access.

Combined Configuration

Here is a full claude_desktop_config.json with all eight servers (minus Figma, which uses the connector UI):

{
  "mcpServers": {
    "github": {
      "command": "docker",
      "args": [
        "run", "-i", "--rm",
        "-e", "GITHUB_PERSONAL_ACCESS_TOKEN",
        "ghcr.io/github/github-mcp-server"
      ],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_your_token_here"
      }
    },
    "brave-search": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-brave-search"],
      "env": {
        "BRAVE_API_KEY": "your_brave_api_key_here"
      }
    },
    "context7": {
      "command": "npx",
      "args": ["-y", "@upstash/context7-mcp@latest"]
    },
    "filesystem": {
      "command": "npx",
      "args": [
        "-y", "@modelcontextprotocol/server-filesystem",
        "/Users/you/projects"
      ]
    },
    "playwright": {
      "command": "npx",
      "args": ["-y", "@playwright/mcp@latest"]
    },
    "snaprender": {
      "command": "npx",
      "args": ["-y", "snaprender-mcp"],
      "env": {
        "SNAPRENDER_API_KEY": "sk_live_your_key_here"
      }
    },
    "supabase": {
      "command": "npx",
      "args": [
        "-y", "@supabase/mcp-server-supabase@latest",
        "--read-only",
        "--project-ref=your-project-ref"
      ],
      "env": {
        "SUPABASE_ACCESS_TOKEN": "sbp_your_token_here"
      }
    }
  }
}

Replace the placeholder tokens with your actual credentials. You do not need all of these servers. Start with the ones that match your workflow and add more later.

6. Desktop Extensions: One-Click MCP Installation

Editing JSON config files works, but it is tedious and error-prone. Desktop Extensions are Anthropic's answer to this problem.

A Desktop Extension is a packaged MCP server that bundles the server code, its dependencies, and a manifest file into a single archive. Double-click the file (or drag it into Claude Desktop), and the server installs automatically. No Node.js, no Docker, no JSON editing.

The original format uses the .dxt file extension. Anthropic has also introduced the .mcpb (MCP Bundle) format for newer extensions; both work, but .mcpb is recommended for new development.

How to install a Desktop Extension:

1. Download the .dxt or .mcpb file from the server's website or GitHub releases
2. Double-click the file, or go to Settings > Extensions > Install Extension and select it
3. Configure any required settings (API keys, directory paths) in the dialog that appears
4. The server is ready immediately, no restart needed

Where to find extensions:

• desktopextensions.com maintains a directory of available extension packages
• Many MCP server repos include extension builds in their GitHub releases
• The Claude Desktop extension browser (Settings > Extensions > Browse) lists reviewed extensions

Not every MCP server has an extension package yet. For servers that only offer npx or Docker installation, you still need the JSON config approach from Section 5. But the number of packaged extensions is growing quickly, and for servers that support it, the installation experience is much smoother.

7. How to Connect Remote MCP Servers

Everything covered so far has been about local MCP servers: processes that run on your machine, started by Claude Desktop when you launch the app. Remote MCP servers are different. They run on someone else's infrastructure, and Claude connects to them over HTTPS.

Why remote servers exist:

• No local dependencies (no Node.js, no Docker)
• The server maintainer handles updates and scaling
• OAuth authentication instead of managing API keys in plain-text config files
• Works on any device without per-machine setup

How they work in Claude Desktop:

Remote servers use the Streamable HTTP transport with OAuth 2.1 for authentication. When you add a remote server, Claude Desktop opens a browser window for you to log in to the service. After you authorize access, Claude stores the OAuth token and connects automatically on future sessions.

Adding a remote server:

1. In Claude Desktop, click your profile icon and open Settings
2. Navigate to Connectors
3. Click Add custom connector
4. Enter the server's MCP endpoint URL
5. (Optional) Provide an OAuth Client ID and Client Secret if the server requires it
6. Click Add and complete the authentication flow in your browser

Example: SnapRender's remote MCP server

SnapRender exposes a remote MCP endpoint at https://app.snap-render.com/mcp. Instead of running npx snaprender-mcp locally and managing an API key in your config file, you can connect via OAuth:

1. Open Settings > Connectors > Add custom connector
2. Enter the URL: https://app.snap-render.com/mcp
3. Click Add
4. Claude opens SnapRender's login page in your browser
5. Sign in with your SnapRender account and approve access
6. Done. No API key to copy, no config file to edit.

The remote server provides the same tools as the local npx version (screenshots, cache checks, usage stats). The difference is purely in how authentication and connectivity work. Use the local version if you prefer keeping everything on your machine; use the remote version if you want simpler setup and automatic token management.

Other services with remote MCP servers include Figma, Supabase, and many database providers. Check your tools' documentation to see if they offer a remote endpoint.

8. Troubleshooting Claude Desktop MCP Issues

"No tools detected" after adding a server

• Restart fully. Quit Claude Desktop (Cmd+Q on macOS, Alt+F4 on Windows) and relaunch. Closing the window is not enough; the app continues running in the system tray.
• Validate your JSON. A missing comma or extra trailing comma will break the entire config. Paste your claude_desktop_config.json into jsonlint.com to check.
• Confirm npx is in your PATH. Open a terminal and run which npx (macOS/Linux) or where npx (Windows). If it does not exist, install Node.js from nodejs.org.

Server starts but tools fail

• Check your API keys. A typo in your GitHub PAT or Brave API key will cause silent failures. Regenerate and re-paste if unsure.
• Docker must be running. For Docker-based servers (like GitHub MCP), Docker Desktop must be started before launching Claude.
• Check the logs. On macOS, open ~/Library/Logs/Claude/ for error output from MCP servers. On Windows, check %APPDATA%\Claude\logs\.

"Command not found" errors

• Windows path issue: npx may need the full path: "command": "C:\\Program Files\\nodejs\\npx.cmd"
• macOS Homebrew/nvm issue: If you installed Node via Homebrew or nvm, the path may not be available to Claude Desktop's process. Set the full path: "command": "/usr/local/bin/npx" (or wherever which npx points). For nvm, try "command": "/Users/you/.nvm/versions/node/v22.0.0/bin/npx".

Slow server startup

• First run is slow. The first npx run downloads the package. Subsequent launches use the cached version and are faster.
• Global install option: If startup is consistently slow, install the package globally (npm install -g @modelcontextprotocol/server-brave-search) and point the command at the global binary instead of using npx.
• Clear stale cache: If a server behaves oddly after an update, clear the npx cache with rm -rf ~/.npm/_npx (macOS/Linux) or delete %LocalAppData%\npm-cache\_npx (Windows), then restart Claude Desktop.

Best practices

Start small. Do not add all eight servers at once. Start with one or two, confirm they work, then add more. Each server is a process that Claude Desktop manages, and debugging six broken servers simultaneously is no fun.

Use read-only where possible. The filesystem server, Supabase, and GitHub all support read-only modes. Use them until you are confident in the setup.

Keep secrets out of version control. If you share your claude_desktop_config.json (for example, in a team dotfiles repo), strip out the API keys first. Use environment variable references or a separate secrets file.

Watch your quotas. Every tool call costs something. Brave Search charges per query, SnapRender charges per screenshot, and Supabase counts against your API limits. Keep an eye on your usage dashboards.

9. Which MCP Servers Should You Install First?

If you are setting up Claude Desktop for the first time, here is the stack I would start with:

Priority	Server	Cost	Why
1	Filesystem	Free, no API key	Let Claude read your project files. This alone makes it dramatically more useful for code-related conversations.
2	Brave Search	$5/mo credits (~1,000 queries)	Give Claude access to current information. Essential when working with fast-moving frameworks.
3	GitHub	Free, requires PAT + Docker	If you use GitHub daily, this saves constant tab-switching.

Add these three, confirm everything works, then expand based on your needs:

• Building web UIs? Add Playwright for browser automation and SnapRender for visual capture.
• Working from Figma designs? Add the Figma connector.
• Using Supabase? Add the Supabase server in read-only mode.
• Tired of Claude using outdated API docs? Add Context7.

The goal is not to install every server available. It is to give Claude the specific tools that match your daily workflow. A focused stack of three or four well-configured servers is more useful than a bloated setup with ten servers you rarely use.

For more MCP server recommendations organized by use case, see Best MCP Servers for Web Developers in 2026 and MCP Servers for Frontend Developers You Haven't Heard Of.

10. FAQ: Claude Desktop and MCP Servers

How do I configure MCP servers in Claude Desktop?

Open Claude Desktop, go to Settings > Developer > Edit Config. This opens the claude_desktop_config.json file in your default text editor. Add your MCP server definitions to the mcpServers object in this JSON file, save it, then quit and relaunch Claude Desktop to load the new servers.

What are MCP servers and do I need them?

MCP (Model Context Protocol) servers are small programs that give Claude access to external tools and data. Without them, Claude can only work with text you paste into the chat. With them, Claude can read your files, search the web, interact with GitHub, query databases, and more. You do not need them for basic chat, but they make Claude significantly more useful for development work.

Is Claude Desktop free to use?

Claude Desktop is a free download, and there is a free tier with limited messages per day. For regular use, you need a Pro subscription at $20/month, which gives you higher message limits and access to all models. Power users can upgrade to Max ($100/month or $200/month) for even higher limits.

Can I use Claude Desktop on Linux?

There is no official Linux build from Anthropic. Community packages exist (such as claude-desktop-debian) that repackage the Windows build to run natively on Debian-based distributions. For a fully supported experience on Linux, Claude Code (the CLI tool) has full MCP support.

How many MCP servers can I run at once?

There is no hard limit, but each MCP server is a separate process consuming memory and CPU. In practice, 5 to 8 servers run fine on most machines. If you notice Claude Desktop becoming slow, reduce the number of active servers or switch some to remote servers (which run on someone else's infrastructure).

What is the difference between local and remote MCP servers?

Local MCP servers run on your machine as child processes of Claude Desktop. You configure them in claude_desktop_config.json with a command and arguments. Remote MCP servers run on external infrastructure and connect over HTTPS with OAuth authentication. Remote servers require no local setup but depend on the provider's uptime. Local servers work offline but need Node.js or Docker installed.

---

Save your claude_desktop_config.json somewhere safe, restart Claude Desktop, and start building.