Icons8 MCP

🚀 Icons8 MCP服务器

Icons8 MCP服务器让AI编码环境能够立即访问超过368,865个Icons8图标，涵盖116种设计风格。你可以将Claude、Cursor、Windsurf、VS Code或任何支持SSE的MCP主机连接到该服务器，免费流式传输高分辨率PNG图标，或者使用API密钥解锁完整的SVG图标交付功能。这非常适合原型设计、生产代码和快速UI实验。

🚀 快速开始

使用场景

• 用一致且时尚的风格替换现有项目中的整个图标集。
• 在不离开IDE的情况下，为项目符号列表、功能亮点、流程步骤和仪表盘添加图标。
• 先用免费的PNG预览图进行快速原型设计，然后升级到SVG以获得适合生产的资源。
• 构建AI辅助工作流程，直接在代码中搜索、预览和插入图标。
• 通过现成的演示，如掉落表情符号、科幻仪表盘和产品目录，展示交互性。

📚 详细文档

工作原理

Icons8 MCP端点托管在 https://mcp.icons8.com/mcp/，可与任何支持服务器发送事件（Server-Sent Events）的MCP客户端配合使用。

前提条件

1. 本地安装 Node.js。
2. 一个兼容MCP的编辑器或代理主机（如Claude Code、Cursor、Windsurf、VS Code等）。

选择你的方案

免费高分辨率PNG图标

使用以下配置无需身份验证即可流式传输高分辨率PNG预览图：

{
  "mcpServers": {
    "icons8mcp": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://mcp.icons8.com/mcp/"
      ]
    }
  }
}

完整SVG访问权限（需要API密钥）

订阅 15美元的SVG计划，并将你的API密钥作为Bearer令牌传递：

{
  "mcpServers": {
    "icons8mcp": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://mcp.icons8.com/mcp/",
        "--header",
        "Authorization:${AUTH_HEADER}"
      ],
      "env": {
        "AUTH_HEADER": "Bearer YOUR_API_KEY"
      }
    }
  }
}

💡 使用建议

根据需要切换配置，使用PNG配置进行免费预览，使用SVG配置进行生产部署。

配置你的客户端

Claude Code

1. 打开终端并运行以下命令：

   claude mcp add icons8mcp -- \
     npx mcp-remote \
     "https://mcp.icons8.com/mcp/" \
     --header "Authorization: Bearer YOUR_API_KEY"
   

2. 验证服务器是否已注册：

   claude mcp list
   

Cursor

1. 点击Cursor → Settings → Cursor Settings → MCP标签。
2. 点击 + Add new global MCP server。
3. 粘贴你所选方案的JSON配置（免费PNG方案无需添加头部信息）。

Windsurf

1. 点击Windsurf → Settings → Windsurf Settings → MCP部分。
2. 管理插件 → View raw config。
3. 粘贴JSON配置并保存。

VS Code（代理模式）

1. 点击Code → Settings → Settings → 搜索 “MCP”。
2. 选择 Edit in settings.json。
3. 添加JSON配置。
4. 打开聊天工具栏（⌥⌘B），切换到代理模式，在 MCP Server: Icons8 MCP 下查找工具。如果工具没有立即显示，请重启VS Code。

其他支持SSE的工具

使用 npx mcp-remote 的相同JSON模板，并为SVG访问提供可选的 Authorization 头部信息。请参考你的主机文档，了解在何处粘贴MCP服务器设置。

开始使用图标进行开发

向你的AI助手请求所需的图标，例如 “创建一个带有彩色风格分析SVG图标的仪表盘” 或 “添加iOS字形风格的MCP服务器图标SVG”。查看以下 实时演示 以获取灵感，如果遇到问题，请查看 常见问题解答。

🎉 实时演示

• 掉落表情符号动画
• 图夫特风格的太阳系
• 科幻控制界面
• 产品目录展示

❓ 常见问题解答

• 如果提示 “No API key” 怎么办？
  订阅15美元的计划 以获取API密钥。
• 如何获取特定的SVG图标？
  在提示中明确请求SVG图标，并确保你的配置中传递了Bearer令牌。
• 有哪些可用的格式？
  所有用户都可以使用PNG预览图。SVG下载需要有效的API密钥。
• 我可以免费下载PNG图标吗？
  可以。连接到MCP服务器时，无需身份验证即可获得PNG图标预览图。
• 免费计划的许可条款是什么？
  免费使用PNG图标需要提供指向Icons8的链接作为归属声明。请查看 Icons8许可协议 以获取完整详情。
• 我需要API密钥吗？
  仅SVG图标交付需要API密钥。PNG预览图无需密钥。
• 我请求了SVG图标，但收到了PNG图标，这是怎么回事？
  再次明确请求SVG图标，并确认你的API密钥已正确配置。
• 我可以批量下载图标吗？
  批量下载功能正在开发中，请持续关注。
• 需要帮助吗？
  查看上述设置步骤，或 与我们聊天。

🙏 致谢

• Product Hunt “Product of the Day” 发布认可。
• © 2025 Icons8 — 有关条款、隐私和支持的链接，请访问 icons8.com。