Token导航 LogoToken导航TokenDH.com
Phosphor Icons MCP Server logo
开发工具stdio官方级别未说明来源级核验

Phosphor Icons MCP Server

MCP Server

skills

一个提供Phosphor图标库访问的MCP服务器,支持多种图标权重、颜色定制和批量操作。

工具数

3

提示词数

0

GitHub Stars

3

资源数

0
开发工具TypeScript命令行工具

安装说明

本站只整理中文说明和来源信息,不托管安装包,也不代用户安装。

作者 / 组织

lasaths

提供方

lasaths

最后核验

2026/5/17 20:20

运行时

Node.js

快速接入

先看主来源和安装命令,再打开仓库或文档;下面只保留这个条目的关键接入事实。

命令预览

npx skills add . --list

详细介绍

荧光图标MCP服务器

](https://smithery.ai/server/@lasaths/phosphor-icons-mcp)

一种模型上下文协议(MCP)服务器,提供对以下内容的访问 荧光图标 -一个灵活的图标系列,有6个不同的权重和1000多个图标。

重要:这是一个 社区驱动,人工智能辅助 MCP服务器 不是官方存储库 或隶属于磷图标项目。该项目是在人工智能的帮助下创建的,由社区维护。原始的Phosphor Icons项目可以在以下网址找到 .

特性

  • 🎨 6图标权重:薄、轻、规则、大胆、饱满和双色调
  • 🌈 颜色定制:应用任何颜色(十六进制、RGB、命名颜色或currentColor)
  • 📏 尺寸控制:以像素为单位指定自定义大小
  • 🔍 搜索图标:按名称、类别或标签查找图标
  • 📦 批量操作:一次获取多个图标
  • 📚 目录访问:使用元数据浏览所有可用图标
  • 🛠️ 实施指南:获取特定于框架的集成帮助

安装

npm install

命令行界面

该包裹运送了一个 phosphor-icons CLI,用于导出SVG/PNG资产,而无需调用MCP。

对于本地开发,请先构建并运行编译后的CLI:

npm run build
node dist/cli.js icon heart --weight bold --color "#ef4444" --size 32 --out heart.svg
node dist/cli.js icon house user gear --format png --size 24 --dir ./icons
node dist/cli.js search arrow --limit 5
node dist/cli.js categories

安装软件包后,使用bin命令:

phosphor-icons icon heart --size 16 --out heart.svg
phosphor-icons icon heart --format png --size 16 --out heart.png
phosphor-icons search arrow --limit 5
phosphor-icons categories

CLI命令:

  • icon :获取一个或多个SVG或PNG格式的图标。
  • search :搜索图标名称和捆绑的元数据。
  • categories:列出捆绑的类别和示例。
  • skill path:打印捆绑的Codex技能目录路径。

旗帜 icon:

  • --weight, -w: thin, light, regular, bold, fill,或 duotone.
  • --color, -c:任何SVG颜色值,包括 currentColor.
  • --size, -s:宽度和高度的像素大小。
  • --format, -f: svgpng.
  • --out, -o:单个图标的输出文件。
  • --dir, -d:批量导出的输出目录。

CLI从已安装的中读取图标 @phosphor-icons/core 先包装。这使得图标导出快速、确定且离线 npm install。如果本地资产不可用,它将回退到Phosphor Core GitHub原始URL。

CLI烟雾测试

npm install
npm run build
node dist/cli.js icon heart --size 16 --out live-heart.svg
node dist/cli.js icon heart --format png --size 16 --out live-heart.png
node dist/cli.js search arrow --limit 5

预期:

  • live-heart.svg 包含 width="16" height="16".
  • live-heart.png 以非零文件大小创建。
  • 搜索返回与箭头相关的图标名称。

技能扩展

本课程包括食品法典委员会/代理商技能 skills/phosphor-icons/SKILL.md. 安装软件包后,使用以下命令将其定位:

phosphor-icons skill path

该技能为代理提供了图标搜索、检索、导出和框架实现的简明规则。 在代理运行时注册技能或将技能复制到代理技能目录时,请使用此路径。

Vercel技能CLI兼容性

该存储库与Vercel Labs兼容 skills CLI格式:技能直播 skills//SKILL.md 文件以开头 namedescription YAML前体。

列出此存储库中的技能:

npm run skills:list
# or
npx skills add . --list

从本地结账安装捆绑技能:

npx skills add . --skill phosphor-icons --agent codex --copy -y

发布后从GitHub安装:

npx skills add lasaths/phosphor-icons-mcp --skill phosphor-icons --agent codex -y

通过解析技能路径从npm包签出安装:

phosphor-icons skill path
npx skills add ./skills/phosphor-icons --agent codex --copy -y

发展

运行开发服务器:

npm run dev

这将在端口8081上启动服务器,并打开Smithery游乐场进行测试。

配置

服务器支持可选配置参数:

  • 默认重量:设置默认图标权重(细、轻、规则、粗体、填充、双色调)。违约: regular

工具

获取图标

从荧光图标库中检索一个或多个SVG图标。为批量检索提供单个图标名称或名称数组。

参数:

  • name (字符串,可选):烤肉串大小写中的单个图标名称(例如,“左箭头”、“用户”)。将此用于单个图标。
  • names (array,可选):用于批量检索的图标名称数组。将其用于多个图标。
  • weight (可选):图标重量/样式
  • color (可选):图标颜色-接受十六进制(#FF0000)、RGB(RGB(255,0,0))、命名颜色(红色)或“currentColor”
  • size (可选):图标大小(像素)(设置宽度和高度)
  • format (可选):输出格式(svgpng).违约: svg
  • saveToFile (可选):保存PNG文件的路径(仅限单个图标)
  • saveDir (可选):保存PNG文件的目录(仅限多个图标)

示例:

get-icon name="heart" weight="bold" color="#FF0000"
get-icon names=["star", "heart"] weight="fill" color="gold" size=48
get-icon name="user" color="currentColor"

搜索图标

按名称、类别或标签搜索图标。

参数:

  • query (string):搜索词
  • limit (可选):返回的最大结果数(默认值:10)

例子:

search-icons query="arrow" limit=5

列出类别

获取所有可用图标类别的列表。

资源

phosphor://catalog

流行荧光图标的完整目录,包括类别、标签和可用权重的元数据。

phosphor://weights

关于6种可用图标权重/样式及其最佳用例的详细信息。

提示

机具图标

获取在项目中实施Phosphor图标的指导。

参数:

  • iconName (string):图标的名称
  • framework (string):前端框架(html、react、vue、svelte、angular)

出版Smithery

  1. 将代码推送到GitHub
  2. 访问 史密斯·艾/新
  3. 连接您的GitHub存储库
  4. 配置自动部署

图标权重

  • :精致、简约的笔触-最适合大尺寸
  • :精致细腻的外观-现代设计
  • 常规:平衡、多功能-通用(默认)
  • 加粗:强大、有影响力-强调和小尺寸
  • 填充:实心、填充的形状-强调
  • 双音:双色调设计-视觉趣味

示例

以粗体显示红心图标:

// Returns SVG content for a bold red heart icon
get-icon({ name: "heart", weight: "bold", color: "#FF0000" })

获得自定义大小的蓝色星形图标:

// Returns a 48px blue filled star icon
get-icon({ name: "star", weight: "fill", color: "#3B82F6", size: 48 })

搜索导航图标:

// Returns list of icons related to navigation
search-icons({ query: "navigation", limit: 10 })

为UI获取多个彩色图标:

// Get home, user, and settings icons all in blue
get-icon({ 
  names: ["home", "user", "gear"],
  weight: "regular",
  color: "#3B82F6",
  size: 24
})

免责声明

无任何保证或责任

本软件按“原样”提供,不提供任何明示或暗示的保证,包括但不限于适销性、特定用途适用性和非侵权性的保证。在任何情况下,作者或版权持有人均不对因软件或软件的使用或其他交易而产生或与之相关的任何索赔、损害赔偿或其他责任承担责任,无论是在合同、侵权或其他诉讼中。

使用风险自负

  • 这是一个 非官方、社区驱动的项目 在人工智能的帮助下创建
  • 该软件不提供任何保证或支持
  • 用户负责为其用例测试和验证软件
  • 维护人员不对因使用本软件而造成的任何损坏、数据丢失或问题负责
  • 该项目未得到官方Phosphor Icons项目的认可或附属

许可证

此MCP服务器已获得MIT许可。Phosphor Icons也获得了麻省理工学院的许可。

链接

学分

  • 图标:由提供 荧光图标 -由Tobias Fried创作
  • MCP服务器:在人工智能协助下创建的社区驱动项目
  • 维护者:社区贡献者(不隶属于Phosphor Icons)

目录标签

目录标签

开发工具TypeScript命令行工具图标服务本地部署MCP服务器前端开发图标管理颜色定制

接入字段

传输方式(transport,传输协议)

stdio

鉴权方式(authType,认证方式)

none

运行时(runtime,运行环境)

Node.js

部署方式(deploymentType,部署类型)

remote-capable

来源包(packageName,安装包名)

skills

工具数量(toolCount,工具数)

3

资源数量(resourceCount,资源数)

0

提示词数量(promptCount,提示词数)

0

权限和风险

stdiononeremote-capable

接入前请确认传输方式、认证方式和部署位置,并根据实际工具能力限制访问范围。

安装前确认

不要直接授予不必要的文件、网络或账号权限;先核对安装命令和配置内容。

来源信息

继续浏览同类 MCP