# Motuicons 开发者文档

给写代码的人和 AI 助手：图标 ID 怎么写、怎么在项目里用、程序可以读哪些公开信息，以及 API 和 MCP 的进度。

只想找图标、复制 SVG，请看《墨图爱可 用户文档》。

# 图标 ID 与项目接入

## 图标 ID

墨图爱可沿用 Iconify 的写法：`图标集前缀:图标名`。

- `tabler:home` 是 Tabler 图标集里的 home。
- 同名不同集是不同的图标：`tabler:home` 和 `mdi:home` 是两枚图标。
- 图标集前缀就是站内图标集页的地址：`/collection/tabler`。
- 单枚图标的页面地址：`/icon/tabler/home`。

注意：

- 中文搜索别名（如「首页」对应 home）只在本站搜索框里有效，**不是**图标 ID。
- 不要把 `/collection/…`、`/icon/…` 页面地址当成 SVG 地址用。

## 在站内拿到代码

顶栏切到「开发者」模式，预览里会多出：

- 图标 ID 和 `i-` 前缀的 class 写法（如 `i-tabler-home`）；
- Vue / React 组件代码；
- 在本地安装整套图标数据的命令（npm / pnpm / yarn / bun 任选）。

## 来自 Iconify 的图标集

这部分图标在 Iconify 官方渠道里都有，程序里请直接从官方渠道取，不要抓本站页面：

- npm 包：`@iconify/json`，单套数据在 `@iconify/json/json/{前缀}.json`；
- Iconify 官方 API：`https://api.iconify.design/{前缀}/{图标名}.svg`，例如 https://api.iconify.design/tabler/home.svg 。

## 本站增补的图标集

本站增补集的前缀以 `motu-` 等开头（如 `motu-fuxa`）。它们的 ID 写法和 Iconify 一致，**但不在 Iconify 官方 API 和 npm 包里**（2026-10-28 实测 `api.iconify.design` 和 npm 上都查不到 `motu-fuxa`）。

所以：

- 不要对增补集执行 `npm i @iconify-json/{前缀}` 之类的安装命令，npm 上没有这些包；
- 用 `@iconify/vue` 等按需从 Iconify 官方 API 取图的组件引用增补集，也取不到图；
- 取用增补集，请在本站预览里复制或下载 SVG，或在图标集页打包下载 SVG / JSON。

墨图爱可自己的图标接口还在开发中，见《API 与 MCP（开发中）》。

<!-- 待站点修复上线后核对：/developers 页的新说法、开发者模式对增补集不再显示安装命令。 -->

## 许可

在代码里引用图标，同样要遵守该图标集的许可。品牌 Logo 能否商用，要看商标说明和该集许可，不是看「MIT」三个字。详见用户文档《图标许可怎么看》。

# 给程序和 AI 助手

墨图爱可主要是给人用的浏览站。程序和 AI 编码助手可以读站点说明、查图标 ID 和许可，但请不要批量抓取页面上的图标栅格。

## 可以读的公开内容

| 地址 | 内容 |
|------|------|
| https://icons.motucloud.com/llms.txt | 站点说明、页面索引、图标 ID 规则，专门写给 AI 助手 |
| https://icons.motucloud.com/sitemap.xml | 站点地图 |
| https://icons.motucloud.com/search.xml | OpenSearch 描述 |
| `/collection/{前缀}` | 图标集页（已预先生成静态页面，含作者、许可、原仓库） |
| `/developers` | 开发者说明 |

## 搜索地址

`https://icons.motucloud.com/?s={关键词}`

打开某一套图标后，搜索默认全库，可以切到「本集」。

## 给 AI 助手的建议写法

- 在代码里写图标 ID（`tabler:home`），不要写本站页面地址；
- 来自 Iconify 的图标集，用 `@iconify/json` 或 `api.iconify.design` 取 SVG；
- 本站增补集（`motu-` 等前缀）只在本站提供，Iconify 官方 API 和 npm 里没有，不要为它们生成安装命令；
- 引用前读一下该集的许可。

# API 与 MCP（开发中）

## 现状

icons.motucloud.com 是浏览站，**没有**按需返回 SVG 的接口，也不是 Iconify 官方接口的替代。现在程序取图标请用：

- npm：`@iconify/json/json/{前缀}.json`
- Iconify 官方 API：`https://api.iconify.design/{前缀}/{图标名}.svg`

以上两种只适用于来自 Iconify 的图标集。本站增补集（`motu-` 等前缀）目前只能在本站复制或打包下载。

## API（开发中）

计划在独立域名 api.motucloud.com 提供与 Iconify 兼容的接口（按 ID 取 SVG、按图标集取 JSON 等），主要给 WordPress 插件、构建脚本和内部工具使用。API 与浏览站分开部署，互不影响。

尚未开放。上线后本页会补充接口地址和示例。

## MCP（开发中）

MCP（Model Context Protocol）让 Cursor、Claude Code 等客户端以工具的方式查图标。计划中的能力：

- 按 `前缀:图标名` 返回 SVG；
- 按关键词返回匹配的图标 ID 列表；
- 读取某套图标的许可、作者和原仓库链接。

MCP 开放后会挂在 API 的域名下，不放在浏览站下面。开放时间和接入地址以站内 /mcp 页和本页更新为准。

<!-- TODO(待确认)：MCP 收录范围是否与站内图标集完全一致、有哪些排除，开放后再写。 -->