内容
# 十月主题 MCP 服务器
将精心策划的设计系统主题注入 AI 生成的 UI 中。该服务器与 Claude、ChatGPT、Cursor、VS Code Copilot、Windsurf 以及任何支持模型上下文协议的工具配合使用。
**摆脱千篇一律的 AI UI。** 该服务器使您的 AI 编码工具能够访问 1000 多个精心打造的设计系统 —— 颜色调色板、字体排版、组件样式、动画和大胆的设计规则 —— 以便每个生成的界面都具有鲜明的、精致的美感。
## 快速开始
添加到您的 AI 工具中 —— 无需 API 密钥，完全免费。
**Claude Desktop / Claude Code** — 添加到 `~/.claude/mcp.json`：
```json
{
"mcpServers": {
"october-themes": {
"command": "npx",
"args": ["-y", "@october-dev/themes-mcp"]
}
}
}
```
**Cursor** — 添加到项目中的 `.cursor/mcp.json`：
```json
{
"mcpServers": {
"october-themes": {
"command": "npx",
"args": ["-y", "@october-dev/themes-mcp"]
}
}
}
```
**VS Code Copilot** — 添加到 `.vscode/mcp.json`：
```json
{
"servers": {
"october-themes": {
"command": "npx",
"args": ["-y", "@october-dev/themes-mcp"]
}
}
}
```
**Windsurf** — 添加到 `~/.windsurf/mcp.json`：
```json
{
"mcpServers": {
"october-themes": {
"command": "npx",
"args": ["-y", "@october-dev/themes-mcp"]
}
}
}
```
### 使用它
只需询问您的 AI：
- *"为这个网站获取一个主题"*
- *"注入一个移动应用主题并构建设置屏幕"*
AI 将自动调用 MCP 工具。
## 工具
| 工具 | 描述 |
|------|-------------|
| `get_theme` | 获取一个有权重随机设计系统的主题，可选按平台（桌面网页、移动应用、游戏）过滤。返回即刻可用的 markdown。 |
| `get_theme_by_id` | 通过 ID/_slug 获取特定主题。 |
## 工作原理
1. 您要求 AI 构建 UI
2. AI 调用 `get_theme` 获取设计系统
3. 主题（颜色、字体排版、间距、组件样式、动画）成为 AI 的上下文的一部分
4. 所有生成的 UI 都遵循该设计系统 —— 不再有千篇一律的 Bootstrap 样式输出
主题由 [October](https://october.dev) 团队精心策划 —— 用于构建应用的 AI 原生画布。每个主题都包括：
- 完整的颜色调色板（8+ 个具有十六进制值的语义颜色）
- 字体排版系统（字体、大小、权重）
- 组件样式（按钮、卡片、输入框，带有真正的 Tailwind 类）
- 效果和动画（阴影、渐变、过渡）
- 非通用性规则 —— 强制大胆的设计选择，以防止单调的输出
## 平台
- **桌面网页** — 网站、仪表盘、SaaS 应用
- **移动应用** — iOS/Android 应用（包括导航、安全区域、触觉反馈）
- **游戏** — 浏览器游戏（包括灯光、粒子、HUD 样式）
## 许可证
MIT
---
由 [October](https://october.dev) 构建 —— 用于构建应用的 AI 原生画布。
