おすすめMCPサーバー10選と使い方｜GitHub・Playwright・Figma・Serena を Claude につなぐ【2026年版】

結論：用途別に「使う物だけ」を選ぶ

MCPサーバーは数多くありますが、全部入れる必要はありません。自分の業務に効くものを1〜2個から始め、ワークフローに馴染んでから増やすのが失敗しない進め方です。追加手順はどのサーバーも同じ(claude mcp add か設定ファイルに1行)なので、迷うのは「何を入れるか」だけです。

この記事では実務で使えるおすすめMCPサーバーを用途別に厳選し、追加手順と選び方をまとめます。「MCPとは何か」は MCP入門、「自作する方法」は MCPサーバーの作り方 を参照してください。

用途別おすすめMCPサーバー

迷ったら、開発者は GitHub または Filesystem、QA は Playwright、フロント開発は Figma、大規模コードを触るなら Serena が入口に向きます。

追加手順は共通

Claude Code

# 例: Playwright MCP を追加
claude mcp add playwright -- npx @playwright/mcp@latest

# 認識を確認
claude mcp list

チームで共有するならプロジェクトルートの .mcp.json：

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

Claude Desktop

claude_desktop_config.json(macOS: ~/Library/Application Support/Claude/、Windows: %APPDATA%/Claude/)の mcpServers に追記し、再起動します。トークンが必要なものは env で渡します。

主要サーバーの使い方

Serena — コードを意味的に扱う

Serena はリポジトリをシンボル単位で検索・編集できるMCPサーバーです。ファイル全文を読ませずに「関数 X の定義」「この型を使っている箇所」だけを取り出せるため、大規模コードでもコンテキストを節約できます。コード理解・リファクタ補助に効きます。

claude mcp add serena -- <serena の起動コマンド>

起動コマンドはバージョンで変わるため、公式リポジトリの README を確認してください。

Playwright — ブラウザを操作させる

claude mcp add playwright -- npx @playwright/mcp@latest

追加後、「ログインページを開いてフォームを送信し、エラーが出ないか確認して」のように自然文で指示すると、実ブラウザを操作します。E2Eテストの作成・実行、UIの動作確認に向きます。

Figma — デザインから実装

Figma の Dev Mode 連携や figma-context-mcp 系を使うと、フレーム・コンポーネント情報を Claude に渡せます。「このデザインの構造を読んで React で実装して」の精度が上がります。完全自動ではなく、構造を正確に読ませる補助と捉えるのが現実的です。

GitHub — リポジトリ操作

GitHub MCP は issue/PR の作成・検索・コメントを Claude に持たせます。「このバグを issue 化して」「変更内容で PR を作って」が自然文で通ります。トークンは read から始め、必要になってから write を付与します。

追加したのに動かない時

1. claude mcp list でサーバーが ✓ か確認
2. command が絶対パス/解決可能か(venv の python 等)
3. npx @modelcontextprotocol/inspector <command> で単体起動を検証
4. stdio サーバーは標準出力を通信に使うため、デバッグ出力は stderr へ

切り分けの起点は MCP Inspector です。ここで動けばサーバーは正しく、問題は登録側にあります。

社内導入のセキュリティ

• 認証情報は env でサーバー側に閉じ、Claude に渡さない
• DB照会は read-only 専用ロール、API は read スコープのトークン
• 破壊的操作(削除/課金系)はサーバー側でハードブロック
• 呼び出しを 監査ログに残す

公式サーバーで感覚を掴み、自社固有ツールだけ自作する流れが安全です。

まとめ

• MCPサーバーは「使う物だけ」1〜2個から。入れすぎは精度・コストを悪化させる
• 追加は claude mcp add か .mcp.json / Desktop config に1行、共通
• 用途別: GitHub/Filesystem(開発)、Serena(コード理解)、Playwright(テスト)、Figma(設計)
• 動かない時は claude mcp list → MCP Inspector で切り分け
• 社内連携は認証情報を渡さない・権限分離・監査ログ

手を動かして定着させる：当サイトの「AIエージェント活用実践編」では Tool Use と MCP を提出物・採点ルーブリック付きの演習で扱います。先に試すなら バイブコーディング実践編 の MCP の章を 4 週間限定無料で。

関連ガイド：

• MCP入門｜Claude を社内ツールに繋ぐ — MCPの設計思想
• MCPサーバーの作り方 — 自作する実装手順
• Claude Agent SDK 入門 — MCPをエージェントから使う
• Claude Code 入門 — MCPを登録するCLI環境