Lucide Icons MCP服务器
Lucide Icons的MCP服务器——从任何AI编码助手中搜索文档、道具和代码示例
](https://www.npmjs.com/package/lucide-icons-mcp-server)   ](https://nodejs.org)
概述
明亮的 是一个美丽而一致的图标工具包，从Feather Icons分叉而来。每个主要框架都有1700多个图标和包，它是最受欢迎的开源图标库之一。
┌─────────────────┐ ┌────────────┐ ┌─────────────────────────┐ ┌────────────────┐
│ AI Assistant │────▶│ MCP Client │────▶│ lucide-icons-mcp-server │────▶│ Knowledge Base │
│ (Copilot/Claude) │◀────│ │◀────│ │◀────│ (1,700+ icons) │
└─────────────────┘ └────────────┘ └─────────────────────────┘ └────────────────┘可用工具
| 工具 | 说明 | 参数 |
|---|---|---|
lucide_search | 搜索图标文档 | query （必填）， category, limit |
lucide_get_icon | 使用SVG和props获取完整的图标文档 | name （必填） |
lucide_get_examples | 获取图标的代码示例 | name （必填）， package |
lucide_list_icons | 列出所有图标，可选择按类别列出 | category |
lucide_list_categories | 列出所有可用的图标类别 | -- |
lucide_get_package_info | 获取软件包的安装和使用指南 | package （必填） |
分类
图标分为： accessibility, account, animals, arrows, brands, buildings, charts, communication, connectivity, cursors, design, development, devices, emoji, files, finance, food-beverage, gaming, home, layout, mail, math, medical, multimedia, nature, navigation, notifications, people, photography, science, seasons, security, shapes, shopping, social, sports, sustainability, text, time, tools, transportation, travel, weather
支持的软件包
| 包 | 框架 |
|---|---|
lucide | 香草JS |
lucide-react | 反应 |
lucide-vue-next | 视图3 |
lucide-angular | 角度 |
@lucide/svelte | Svelte 5 |
lucide-svelte | Svelte 4 |
lucide-solid | SolidJS |
lucide-preact | 前言 |
lucide-react-native | React Native |
lucide-static | 静态/CSS |
@lucide/astro 星的 |
快速开始
npx lucide-icons-mcp-server配置
VS代码（GitHub副本）
添加 .vscode/mcp.json:
{
"servers": {
"lucide-icons": {
"type": "stdio",
"command": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}克劳德桌面版
添加 claude_desktop_config.json:
{
"mcpServers": {
"lucide-icons": {
"command": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}光标
添加 .cursor/mcp.json:
{
"mcpServers": {
"lucide-icons": {
"command": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}帆板运动
添加 ~/.codeium/windsurf/mcp_config.json:
{
"mcpServers": {
"lucide-icons": {
"command": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}Amazon Q开发者命令行界面
添加 ~/.aws/amazonq/mcp.json:
{
"mcpServers": {
"lucide-icons": {
"command": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}泽德
添加 settings.json:
{
"context_servers": {
"lucide-icons": {
"command": {
"path": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}
}JetBrains集成开发环境（IntelliJ、WebStorm等）
- 首选 设置→ 工具→ AI助手→ MCP服务器
- 点击 添加
- 将命令设置为
npx有争论["-y", "lucide-icons-mcp-server"]
克莱恩
添加 cline_mcp_settings.json:
{
"mcpServers": {
"lucide-icons": {
"command": "npx",
"args": ["-y", "lucide-icons-mcp-server"]
}
}
}发展
先决条件
- Node.js>=20
- npm
设置
git clone https://github.com/matracey/lucide-icons-mcp-server.git
cd lucide-icons-mcp-server
npm install构建
npm run build测试
npm test # Run tests
npm run test:watch # Watch mode
npm run test:coverage # With coverage report在本地运行
npm run dev # Watch mode with tsx
npm start # Run built version重新生成知识库
npm run generate这将从Lucide API获取图标元数据(/api/categories, /api/tags)，从GitHub下载SVG内容，并将结果输出到 src/data/generated/.
运作原理
建筑
服务器使用 MCP-SDK 通过stdio传输公开6个工具。当人工智能助手连接时，它可以调用这些工具来查询1700多个Lucide图标的预构建知识库。
知识库生成
这 scripts/generate-knowledge-base.ts 脚本：
- 从以下位置获取图标类别
https://lucide.dev/api/categories - 从以下位置获取图标标签
https://lucide.dev/api/tags - 从下载每个图标的SVG内容
lucide-icons/lucideGitHub仓库 - 从模板生成所有11个框架包的代码示例
- 输出结构化JSON文件(
src/data/generated/icons.json)
搜索评分
搜索引擎使用基于令牌的评分系统：
| 比赛类型 | 得分 |
|---|---|
| 精确名称/匹配符 | +100 |
| 名称/段符包含查询 | +50 |
| 名称/段符包含标记 | +30 |
| 标签完全匹配 | +20 |
| 标签包含标记 | +10 |
| 类别匹配标记 | +15 |
结果按分数排序，并返回到指定的限制（默认值10，最大值20）。
项目结构
src/
├── index.ts # Entry point — stdio transport setup
├── server.ts # MCP server & tool definitions
├── types.ts # TypeScript interfaces
├── constants.ts # Package definitions, categories, URLs
├── search.ts # Fuzzy search logic
├── formatters.ts # Markdown output formatters
├── data/generated/ # Generated icon knowledge base
└── __tests__/ # Tests (vitest)
scripts/
└── generate-knowledge-base.ts # Data generation script贡献
欢迎投稿！请参阅 贡献.md 作为指导方针。
- 打开一个问题 对于bug或功能请求
- 提交带有更改的拉取请求
许可证
麻省理工学院——见 许可证 了解详情。