Claude 只會聊天太浪費：4 個免費 MCP 讓它從回話變工作站

你打開 Claude 都拿它做什麼？大部分人的答案還是「聊天問問題」、「幫我改一段文字」——這樣用只發揮它三成的力氣。

我這陣子把手上四個免費 MCP 都接上 Claude 跑過一輪，發現差別不在 Claude 本身，而在它能不能伸手碰到你日常在用的東西：你的 GitHub repo、你的瀏覽器、最新版的 API 文件、你的 Figma 設計稿。這四個 MCP 剛好一次補齊，而且全部有官方或準官方版本、開源、可以免費用起來。

這篇把這四個免費 MCP 各自解決什麼、怎麼裝、要注意什麼寫清楚——讀完你可以自己決定要接哪一個。

為什麼「Claude 只會回你話」是低估它了

先講一件我這陣子觀察到的事：大部分人的 AI 對話都停在「AI 回一段文字」這一格。你問問題、它回答、你複製走。這樣用 Claude 就跟用一本很聰明的參考書差不多。

但 Claude 這類 AI 應用其實有個插槽，叫做 MCP（Model Context Protocol），中文可以說是「模型上下文協議」——簡單說就是讓 Claude 伸手去操作外部工具的一種標準插頭。它不是模型、不是外掛，就是一份「大家講好的接口規格」。想深入了解可以看我之前寫的MCP 是什麼？三個新手最常搞錯的誤解。

有了 MCP 之後，Claude 就從「回話」升級到「動手」——你叫它「幫我看看 issue #42 講什麼」、「打開這個網頁抓標題」、「照這張 Figma 生一個 React 元件」，它是真的去做，不是在對話裡演給你看。

那要接哪些 MCP 呢？下面這四個是我目前覺得最值得一次接起來的，通通免費，而且四個組合起來就是一個工作站的雛形。

1. GitHub 官方 MCP：讓 Claude 直接讀你的 repo、PR、issue

先講最好裝、也最實用的一個——GitHub 自家推的 MCP server（官方 repo）。

想像一下，如果 Claude 對你 GitHub 帳號來說就是一位有讀寫權限的協作者：它可以幫你翻 issue、看 PR、拉分支比較差異、甚至幫你開 issue 或評論 PR。這就是 GitHub 官方 MCP 在做的事。

它的授權是 MIT、完全開源。工具箱依官方 README 的 Available Toolsets 表格是 21 組大類，常見的幾組包含：

• repos（版本庫）：讀原始碼、切分支、比對修改
• issues / pull_requests：查、開、評論 issue 跟 PR（也就是要合入的變更）
• actions：跑自動化工作流程、看執行狀態
• code_security / secret_protection / dependabot：資安警告與相依套件警示
• discussions / gists / notifications：日常整理

這是官方文件明列的工具名稱，不是我編出來的分類。

實務上有兩種接法：一種是遠端版本（Remote），主機由 GitHub 自己維護，你只要在 Claude 那邊加設定就好；另一種是本地版，適合你的客戶端還不支援遠端連線、或你有自架 GitHub 的需求。VS Code 系列有一鍵安裝按鈕，Claude Desktop 跟 Cursor 走設定檔加入。

這個接完最直接的變化是： 你不用再每次貼網址給 Claude 說「你看這個 PR」，直接叫它「幫我讀第 128 號 PR」就好。

2. Playwright MCP：讓 Claude 開瀏覽器，而且動作可預期

第二個是 Microsoft 官方推的 Playwright MCP。Playwright 本來就是他們家的瀏覽器自動化框架，這個 MCP 等於把那套能力交給 Claude。

一個比喻：如果 GitHub MCP 是給 Claude 一副眼睛看程式碼，Playwright MCP 就是給它一雙手指跟遙控器去操作網頁。

有意思的是它的操作方式——不是靠螢幕截圖給 AI 看畫面。它把整個網頁的「可存取樹」（accessibility tree，本來是給無障礙工具讀螢幕用的結構化描述）餵給 Claude，Claude 是在讀結構、不是在猜像素。

差別在哪？看下面這張對照：

Claude Code 接它是一行：

claude mcp add playwright npx @playwright/mcp@latest

其他客戶端就是標準的 MCP 設定，把 command 填 npx、args 填 ["@playwright/mcp@latest"] 就好。

適合的情境很直接：

• 想叫 Claude 去某個網站抓資料、填表單
• 確認頁面有沒有跑起來（跟以前寫 e2e 測試同一件事）
• 做一次無聊的重複點擊

以前這種事你可能會找一個第三方自動化工具，現在直接讓 Claude 做。

3. Context7：把最新版文件塞進 prompt，Claude 就不再唬你

第三個是 Upstash 推的 Context7，官方標語（tagline）直接寫「Up-to-date Code Docs For Any Prompt」——幫任何 prompt 補上最新版的程式庫文件。

先說它解決的痛點。你叫 Claude 用 Next.js 15 寫一段路由，很有機會拿到 Next.js 12 或 13 的寫法——因為它訓練資料截止的那天，可能連 15 都還沒出。AI 不是在騙你，它是真的以為那還是最新的。

沒接 Context7，AI 給你的程式碼常見這三種老問題：

• 用舊版寫法：這個 method 一年前叫這個名字，現在已經改了
• 參數對不上：實際 API 已經多了兩個必填參數，AI 給你的還是舊簽名
• 編造一個不存在的 API（英文叫 hallucination）：語法看起來很合理，跑起來直接噴錯

Context7 的做法是——你在 prompt 尾巴加一句「use context7」，Claude 就會透過 MCP 去 Context7 抓當下這一秒的官方文件跟程式碼範例，塞進上下文。也就是說 AI 用的不是它記憶裡的版本，是今天真實的版本。

授權跟收費要說清楚：MCP 客戶端本身是 MIT 開源，後端服務是閉源的。Free 方案每月給免費呼叫額度（依 context7.com/plans 目前是 1,000 次／月，超過會限流），要拉高上限就到 context7.com/dashboard 拿一組金鑰；用量真的大就要看付費方案。個人平常使用大多在免費額度內。

安裝更誇張——一句話：

npx ctx7 setup

想指定客戶端加 flag 就好：--cursor、--claude、--opencode 分別對應不同工具。這是我看過所有 MCP 裡最不需要看說明書的一個。

4. Figma MCP：把設計稿直接變程式碼，中間那段抄寫沒了

第四個是 Figma 官方的 Figma MCP server（原名 Dev Mode MCP Server，2025 年改成現在的名字，如果你看到舊名字別以為是不同東西）。

前面三個是「讓 Claude 動手」，這個是「讓 Claude 看得懂設計稿」。差別是什麼？以前你要把一張 Figma 給 AI，做法通常是截圖丟過去——AI 看到的是像素、不是設計。它得從畫面猜這個按鈕是什麼元件、字級是多少、顏色是哪個 token。

Figma MCP 給的是結構化的設計資訊。你選中一個版面，它會把下面這些東西通通餵給 Claude：

• 變數（variables）：像顏色 token、字級、間距這種設計系統的參數
• 元件（components）：這是按鈕、那是卡片，還有它們的變體
• 排版資料（layout data）：對齊、間距、grid 的實際數字
• Code Connect 對應：這個元件在你 codebase 裡的檔案路徑是哪一個

官方部落格寫得很直白：「If Figma knows which components you’re using, it can share the exact path to the code file the agent needs with Code Connect.」——它不是給你一張圖去描，它直接告訴你那塊在你 code 裡的哪一個檔案。

分兩種：

支援的客戶端官方明列 Claude Desktop、Claude Code、Cursor、VS Code、Codex、Gemini CLI、甚至 Xcode——你能想到的主流 AI 開發工具幾乎都吃。

要注意：Remote 版本是免費，但反向把 AI 產出寫回 Figma 檔案（write-to-canvas）目前（截至 2026 年 8 月）雖然免費，官方說之後會轉成按用量收費，長期這一塊要看官方後續公告。

那我到底要接幾個？

其實我的答案是——先接一個，用順了再往下。

如果你完全沒接過 MCP，我建議從 Context7 開始——一句話裝完、跑起來立刻感覺得到差別，因為你叫 Claude 寫程式時它從此不會再給你舊版 API。裝順了再接 GitHub、Playwright，最後再看要不要接 Figma。

最後說兩句

回到最開始那句話——大部分人只把 Claude 當一本很聰明的參考書。其實它可以是一個伸手到你日常工具的協作者，只是那扇門叫做 MCP，你得自己去接。

而剛好這四個免費 MCP 湊起來，是我目前看到最短路徑能把 Claude 從「回你話」升級到「幫你做事」。花你一個下午裝好，用一週你就回不去了。

想繼續看實際用例，我之前寫過把 Claude 接進 TradingView (MCP) 這一篇，示範了 MCP 在看盤情境下真正跑起來長什麼樣；如果你想自己動手做一個 MCP，也可以看我從空資料夾實測的MCP server 教學。

接下來看什麼

• MCP 是什麼？三個新手最常搞錯的誤解一次講清楚——把 MCP 這個概念本身講清楚
• 把 Claude 接進 TradingView (MCP)：截圖看盤已經過時——一個實際跑起來的 MCP 用例
• MCP server 教學：自己寫一個要多久？我從空資料夾實測一次——想自己寫一個 MCP 的入門
• AI 幫你寫程式老是衝太快、還自稱「完成了」？——幫 Claude Code 裝一套工作紀律
• graphify 知識圖譜：讓 AI 不用每次都重新認識你的專案——另一種「餵 AI 上下文」的思路