内容
# 数字庁设计系统 MCP 服务器
> 注意: 该项目不是数字庁的官方产品。它是基于DADS公开信息的非官方实现。
数字庁设计系统(DADS)v2.12.0的指南、设计标记和组件规格,通过Model Context Protocol在AI编辑器中可引用,是使用TypeScript构建的MCP服务器。
## 状态
- 可在本地使用(stdio传输,不开放外部端口)
- 通过从GitHub仓库克隆和构建可运行
## 功能
| 工具 | 概要 |
|--------|------|
| `search_guidelines` | 指南关键词搜索 |
| `get_guideline` | 通过章节ID获取详细信息 |
| `get_color_tokens` | 颜色标记列表 |
| `get_component_spec` | 组件规格(Do/Don't/无障碍) |
| `get_typography_spec` | 字体规格 |
| `get_spacing_tokens` | 间距标记列表 |
| `validate_color_usage` | WCAG对比度验证 |
### 资源
| URI | 内容 |
|-----|------|
| `dads://foundations/color` | 颜色系统整体 |
| `dads://foundations/typography` | 字体系统整体 |
| `dads://foundations/spacing` | 间距系统整体 |
| `dads://foundations/layout` | 布局系统整体 |
## 使用步骤
### 1. 从仓库在本地使用
目前最稳妥的使用方法是克隆仓库,在本地构建服务器并注册到MCP设置。
```bash
git clone https://github.com/keisato848/design-system-mcp.git
cd design-system-mcp
npm install
npm run build
```
### 2. 在AI编辑器中注册MCP服务器
#### VS Code
`.vscode/mcp.json`:
```json
{
"servers": {
"dads-design-system": {
"type": "stdio",
"command": "node",
"args": ["dist/index.js"],
"cwd": "${workspaceFolder}"
}
}
}
```
该仓库中包含了一个可以直接使用的`.vscode/mcp.json`和一个示例设置`.mcp.json`。
#### Claude Desktop
`claude_desktop_config.json`:
```json
{
"mcpServers": {
"dads-design-system": {
"command": "node",
"args": ["/absolute/path/to/design-system-mcp/dist/index.js"]
}
}
}
```
#### Cursor
`.cursor/mcp.json`:
```json
{
"mcpServers": {
"dads-design-system": {
"command": "node",
"args": ["/absolute/path/to/design-system-mcp/dist/index.js"]
}
}
}
```
### 3. 重启编辑器并确认连接
连接后,可以通过以下查询确认功能是否正常。
```text
「DADS 的 primary 颜色是什么」
「button 组件的 Do / Don't 是什么」
「#333333 和 #FFFFFF 的对比度是多少」
```
## 开发者相关
### 设置
```bash
npm install
```
### 命令
```bash
npm run build
npm test
npm run audit
npm run dev
```
### 本地执行模型
- 通信方式为stdio(JSON-RPC 2.0)
- 作为每个用户独立的本地进程运行
- 不需要API密钥或外部服务器
- 不开放外部端口
## 技术栈
- TypeScript 5.x
- `@modelcontextprotocol/sdk` v1.29.0
- Zod
- Vitest
## 许可证和数据来源
### 源代码
仓库中的实现代码遵循[MIT License](LICENSE)。
### 数据来源
本项目的数据来源于[数字庁设计系统 β版 (DADS)](https://design.digital.go.jp/dads/) v2.12.0。
### 公开数据的使用条件
DADS的公开数据遵循[公共数据利用规约 第1.0版 (PDL1.0)](https://www.digital.go.jp/resources/open_data/public_data_license_v1.0),兼容CC BY 4.0。
本项目遵守以下规则:
- 在每个数据文件和工具输出中明确来源URL
- 声明将DADS的公开信息加工成TypeScript数据
- 不包含LOGO、标志等适用对象以外的素材
## Contributing
问题和错误报告请使用[GitHub Issues](https://github.com/keisato848/design-system-mcp/issues)。
## 致谢
本项目利用了数字庁公开的设计系统信息,但并非数字庁官方提供或推荐。