Icons8 MCP server

Icons8 MCP server

422,674 個 SVG 和 PNG 圖示，涵蓋 130 種風格，直接整合到您正在使用的 AI 編輯器中

免費使用

Product Hunt

當日產品

大型圖示包，單一風格最多 40,000 個圖示

130 種風格可供選擇

適用於

Claude Code、

Codex、

Cursor、

Windsurf

以及其他 AI 程式設計工具

將專案中的所有圖示替換為時尚圖示

或任何其他風格

為所有項目符號清單和功能區塊新增圖示、

流程步驟、導覽等。

使用 Icons8 MCP 製作的示範

Emoji 風格 · 36 個圖示

29 個圖示，以 SVG 內嵌

10 個圖示，單一輪廓風格

Color 風格 · 27 個圖示

如何使用 Icons8 MCP

您需要什麼

• Claude Code、Codex、Cursor、Windsurf、VS Code 或類似的 AI 程式設計工具
• 在 Claude Code 和 Codex 中使用外掛程式路線需要 Node.js：隨附的伺服器透過 npx mcp-remote 執行。Cursor、Windsurf 和 VS Code 的手動設定直接使用 HTTP 通訊，因此無需安裝任何東西

步驟 1：連接 Icons8

Claude Code

Codex

Cursor

Windsurf

VS Code

其他

在終端機中輸入一行指令即可同時安裝 MCP 伺服器和 icons8 技能：

claude plugin marketplace add icons8/agent-skills && claude plugin install icons8@icons8

複製程式碼

首次使用時核准伺服器，然後使用 /mcp 檢查。這就是完整的設定。

想留在 Claude Code 裡面？以下兩個指令效果相同：

/plugin marketplace add icons8/agent-skills

複製程式碼

/plugin install icons8@icons8

複製程式碼

icons8 技能新增了什麼

• 每個專案一種風格，儲存至 icons8.json。提交後，下一次工作階段會保留該風格，而不是重新選擇。
• 設定使用一個簡單的齒輪圖示，而非同名的品牌標誌。
• 在您反覆調整時提供免費的 PNG 預覽，只有您核准的圖示集才提供 SVG。

MCP 為您的代理程式提供目錄，技能則提供規則。沒有技能時，代理程式會為每個標籤取第一個搜尋結果，這就是為什麼一個畫面最終會出現四種不同風格的圖示。以 Apache-2.0 開源：github.com/icons8/agent-skills。

步驟 2：在需要時解鎖 SVG

以上所有功能都已經可以使用：搜尋、PNG 預覽、任意尺寸的高解析度 PNG。SVG 是生產格式，需要金鑰。

金鑰會解鎖第五個工具 get_icon_svg：目錄中任何風格的真正 SVG，可乾淨縮放並跟隨文字顏色。PNG 保持免費，並附帶返回 Icons8 的連結。訂閱 $15，然後從您帳戶的 MCP 分頁取得現成的設定程式碼：其中已填入您的金鑰。或者手動將金鑰加入任何設定：

{ "mcpServers": { "icons8mcp-svg": { "type": "http", "url": "https://mcp.icons8.com/mcp/", "headers": { "Authorization": "Bearer YOUR_API_KEY" } } } }

複製程式碼

在 Claude Code 中，同樣的事情只需一個指令：

claude mcp add --transport http icons8mcp-svg https://mcp.icons8.com/mcp/ --header "Authorization: Bearer YOUR_API_KEY"

複製程式碼

確認金鑰已生效：執行 claude mcp list。五個工具表示已到達，第五個是 get_icon_svg。四個工具表示標頭沒有到達伺服器。

已在步驟 1 安裝外掛程式？ 那麼您的伺服器是隨附的無金鑰版本，因此無論您要求什麼，SVG 都會保持鎖定。請新增上述有金鑰的伺服器：兩者並行執行，PNG 工具會出現兩次，您可以在用戶端中停用無金鑰的那個。

步驟 3：將圖示加入您的專案

提出您的需求。如果您心中有特定風格，請指名；如果沒有，請先要求查看幾種：PNG 預覽免費且不需要金鑰，因此比較不需要任何成本。

• 「以 PNG 預覽顯示六種不同 Icons8 風格的設定圖示，並告訴我每種風格的名稱。」
• 「建立一個設定畫面。使用 Icons8 的 Material Outlined 圖示，24px。」
• 「將此專案中的所有圖示替換為 Flat Color，並保持目前尺寸。」
• 「為登陸頁面上的六個功能區塊新增圖示，單一風格，48px。」

描述外觀也可以：「細輪廓、無顏色、24px」、「登陸頁面用的扁平顏色」、「手繪」。技能會將您的代理程式選擇的風格儲存至 icons8.json，因此後續工作階段會自動保留。所有 130 種風格都可以在 icons8.com/icons 瀏覽。

值得放入提示詞的三件事

• 風格。 指定一次，技能就會在 icons8.json 中為整個專案鎖定它。ID 是風格特定的，因此之後更改風格意味著需要重新選擇每個圖示。
• 尺寸。 每種風格都是為特定尺寸繪製的，從 16px 字形到 64px 彩色場景。詢問您的代理程式您選擇的風格是為哪個尺寸繪製的，然後使用該尺寸或將其加倍。50px 的圖示縮小到 16px 會失去使其可讀的細節。
• 格式。 PNG 預覽免費且即時，因此請先反覆調整，待圖示集最終確定後再要求 SVG。SVG 需要金鑰，請參閱步驟 2。

以下是同一個畫面建置兩次的結果：左側沒有指定風格，因此代理程式為每個標籤取了第一個結果。右側為整個畫面指定了一種風格。

未指定風格

圖示來自四種不同風格：設定使用品牌標誌、單色側邊欄中的全彩頭像、狀態使用表情符號。

Material Outlined，24px

18 個圖示，統一的線條粗細、統一的外觀。每個圖示都跟隨文字顏色，因此深色模式和主題化免費獲得。

查看即時示範以獲得靈感。如果某些功能無法運作，請參閱常見問題。

常見問題

如果顯示「沒有 API 金鑰」怎麼辦？

訂閱 $15，在您的 Icons8 帳戶中找到 MCP 分頁以取得設定程式碼。或者，從 Icons8 開發者入口網站取得 API 金鑰。

如何讓整個專案保持單一圖示風格？

步驟 1 中的 icons8 技能會為您完成此操作：它會為整個專案選擇一個圖示包並鎖定在 icons8.json 中。提交該檔案，下一個工作階段或其他代理程式就會保持相同風格。沒有技能時，請在您的第一個提示詞中指定風格，並在之後新增圖示時重複指定。ID 是風格特定的：同一個圖示在每種風格中都有不同的 ID，因此之後更改風格意味著需要重新選擇每個圖示。

我可以獲得哪些格式？

SVG（需要 API 金鑰），所有使用者都可以使用 PNG 預覽。

我可以免費使用 MCP 伺服器下載 PNG 圖示嗎？

可以，當您連接到 Icons8 MCP 伺服器時，無需 API 金鑰即可使用 PNG 圖示預覽。

免費版本的授權條款是什麼？

透過 MCP 下載的所有 PNG 圖示都可以免費使用，只要您提供返回我們的連結，在生產環境中也是如此。請在此處查看我們的授權。對於需要在生產 UI 中縮放的資產，請使用帶有 API 金鑰的 SVG。

這是開源的嗎？

技能和外掛程式在 GitHub 上以 Apache-2.0 授權，skills.sh 列表通過了 Socket、Snyk 和 Gen Agent Trust Hub 安全稽核。圖示本身是單獨授權的：免費使用需註明出處，SVG 屬於付費方案。

我需要 API 金鑰嗎？

PNG 無需金鑰即可使用，SVG 下載需要付費 API 金鑰，請在您帳戶的 MCP 分頁中找到。

我要求 SVG 但仍然收到 PNG

執行 claude mcp list 並計算工具數量。四個表示金鑰沒有到達伺服器，請檢查設定中的 Authorization 標頭，或從 MCP 分頁複製現成的設定。五個工具但仍然收到 PNG：在提示詞中指定格式，如果您安裝了外掛程式，請確保您的代理程式使用了有金鑰的伺服器，而不是隨附的無金鑰版本。

我應該要求什麼圖示尺寸？

該風格繪製時使用的尺寸：Simple Small 為 16px，Material 和 Windows 11 為 24px，iOS 為 30 到 50px，彩色風格為 48px 及以上。大型風格使用在小尺寸時細節會消失。您的代理程式可以告訴您任何風格繪製時使用的尺寸。

我可以批次下載圖示嗎？

還不行，但這正是我們目前正在積極開發的功能。

它支援 OpenAI Codex 嗎？

支援。執行 codex mcp add icons8mcp --url https://mcp.icons8.com/mcp/，然後使用 npx skills add icons8/agent-skills --skill icons8 新增技能。對於 SVG，使用 --bearer-token-env-var 將 Codex 指向您的金鑰，請參閱步驟 2。

需要協助？

請查看我們的文件或與我們聊天。