项目简介

Dialtone MCP Server是一个基于Model Context Protocol构建的服务器，专门用于提供Dialpad公司设计系统Dialtone的各种资源。它允许AI助手通过标准化协议访问设计系统的完整文档和工具。

主要功能

CSS工具类搜索：查询padding、margin、display、flex等CSS属性和值，返回对应的工具类名称和使用方法。
设计令牌搜索：查找CSS变量形式的颜色、间距、字体等设计令牌。
Vue组件搜索：搜索Dialtone组件库中的Vue组件及其属性、事件和插槽信息。
图标库搜索：根据图标名称、分类或关键词查找合适的图标组件。
资源托管：提供完整的utility-classes、tokens、components、icons和client-rules等设计资源。

安装步骤

通过npm安装Dialtone MCP Server：

npm install -D @dialpad/dialtone-mcp-server

在MCP客户端配置中添加服务器信息：

{
  "mcpServers": {
    "dialtone": {
      "command": "npx",
      "args": ["@dialpad/dialtone-mcp-server"]
}

服务器配置

该MCP服务器使用stdio传输协议，启动命令为'npx @dialpad/dialtone-mcp-server"


## 基本使用方法
安装并配置后，AI助手可以通过MCP协议调用以下工具：
- 'search_utility_classes'：搜索CSS工具类
- 'search_tokens'：搜索设计令牌
- 'search_components**：搜索Vue组件
- 'search_icons**：搜索图标资源

服务器会自动检查更新，并在启动时显示版本信息。如果检测到新版本，会提示用户更新以获得最新功能。

服务器支持智能过滤功能，会自动移除已弃用的项目，并为不推荐使用的项目提供替代方案。

服务器支持多种搜索方式，包括关键词搜索、属性值匹配和语义化查询，帮助开发者快速找到合适的设计系统资源。