MCP Color Convert

MCP颜色转换器

一个全面的模型上下文协议（MCP）服务器，用于颜色转换、操作、分析和可访问性，专为AI编码代理和助手设计。此服务器使用 colorizr 图书馆。

AI代理用例

• UI/UX设计：在不同平台的格式之间转换设计系统颜色
• 网站开发：转换CSS、SVG和画布应用程序的颜色
• 数据可视化：使用感知均匀的OkLCH转换图表和图形的颜色
• 主题生成：在不同的颜色空间中创建一致的调色板
• 无障碍：通过在感知颜色空间中工作来确保适当的颜色对比度
• 设计系统：生成完整的色板和和谐的配色方案
• 颜色操纵：为UI状态调亮、调暗、饱和和旋转颜色
• 无障碍合规：WCAG对比度分析和文本颜色优化

配置后，您的AI编码代理将能够在您的开发工作流程中无缝地发现和使用这些颜色转换工具。

安装和配置

MCP客户端配置

这是使用MCP服务器的推荐方式。将其添加到MCP客户端配置中：

Claude桌面或Gemini CLI

将此服务器添加到代理配置文件中：

{
  "mcpServers": {
    "color-converter": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-color-convert@latest"
      ]
    }
  }
}

自定义MCP客户端配置

对于任何支持stdio传输的MCP客户端：

{
  "servers": [
    {
      "name": "color-converter",
      "description": "AI-powered color conversion, manipulation, analysis, and accessibility tools for design systems",
      "transport": {
        "type": "stdio",
        "command": "npx",
        "args": ["-y", "mcp-color-convert@latest"]
      }
    }
  ]
}

这 npx -y mcp-color-convert@latest 命令确保：

• 如果不存在，则自动安装
• 始终使用最新版本
• 不需要全局依赖关系
• 适用于不同的环境

有关具体配置的详细信息，请参阅MCP客户的文档。

支持的颜色格式

此MCP服务器支持以下颜色格式之间的转换：

输入格式（任何接受的格式）：

• 十六进制: #FF0000, #ff0000
• 红绿蓝: rgb(255, 0, 0), rgb(255,0,0)
• RGBA: rgba(255, 0, 0, 0.5), rgba(255,0,0,0.5) （带阿尔法/透明度）
• HSL: hsl(0, 100%, 50%), hsl(0,100%,50%)
• HSLA公司: hsla(0, 100%, 50%, 0.5), hsla(0,100%,50%,0.5) （带阿尔法/透明度）
• OkLCH: oklch(63.269% 0.25404 19.90218) （现代感知色彩空间）
• OkLCH与阿尔法: oklch(63.269% 0.25404 19.90218 / 0.5) （alpha使用斜线语法）
• OkLab: oklab(0.62796 0.22486 0.12585) （感知颜色空间）
• OkLab with alpha: oklab(0.62796 0.22486 0.12585 / 0.5) （alpha使用斜线语法）
• 命名的颜色: red, blue, green, purple等等。

阿尔法/透明度支持： 所有主要颜色格式都支持alpha值（0-1比例）：

• RGBA/HSLA使用逗号语法： rgba(255, 0, 0, 0.5)
• OkLCH/OkLab使用斜线语法： oklch(63.269% 0.25404 19.90218 / 0.5)
• 在支持Alpha的格式之间转换时保留Alpha
• 当转换为不支持Alpha的格式（如十六进制）时，Alpha会被删除

输出格式（用于转换工具）：

• hex -退货： #FF0000
• rgb -退货： rgb(255 0 68)
• hsl -退货： hsl(344 100% 50%)
• oklch -退货： oklch(63.269% 0.25404 19.90218)
• oklab -退货： oklab(0.62796 0.22486 0.12585)

可用工具

颜色转换

• convert -任何支持格式之间的通用转换器。接受任何有效的颜色输入（十六进制、rgb、rgba、hsl、hsla、oklch、oklab或命名颜色，如“红色”、“蓝色”），包括阿尔法/透明度值，并转换为十六进制、rgb、hsl，oklch或oklab格式。在支持Alpha的格式之间转换时保留Alpha，在转换为非Alpha格式时删除Alpha。使用彩色化器的内置转换功能进行最佳格式处理。

颜色操纵

• lighten -按百分比增加颜色亮度
• darken -按百分比减少颜色亮度
• saturate -按百分比增加颜色饱和度/强度
• desaturate -按百分比降低颜色饱和度/强度
• invert -创建完全相反/互补的颜色（180°色调旋转）
• grayscale -使用感知OkLCH将颜色转换为灰度
• rotate -围绕色轮逐度旋转色调

色彩分析

• luminance -获取WCAG相对亮度（0-1比例）
• chroma -获取颜色强度/纯度（0-1标度）
• opacity -从支持透明度的任何颜色格式中提取阿尔法/不透明度值（0-1比例）
• name -获取通用颜色名称或十六进制（如果未命名）

色彩生成

• palette -从基础色生成6色和谐调色板
• scheme -产生色彩和谐（互补、三和弦、四和弦等）
• swatch -生成11个阴影设计系统样本（50-950）
• random -以指定格式生成随机颜色

辅助功能工具

• contrast -计算两种颜色之间的WCAG对比度
• compare -完整的WCAG合规性分析及建议
• text_color -获取背景的最佳文本颜色（黑/白）

实用工具

• is_valid_color -验证颜色字符串是否可解析

示例用法

将任何颜色格式转换为另一种：

{
  "tool": "convert",
  "arguments": {
    "color": "#FF0000",
    "format": "oklch"
  }
}
// Returns: "oklch(63.269% 0.25404 19.90218)"

将命名颜色转换为HSL：

{
  "tool": "convert",
  "arguments": {
    "color": "blue",
    "format": "hsl"
  }
}
// Returns: "hsl(240 100% 50%)"

将RGBA转换为十六进制（去除alpha）：

{
  "tool": "convert",
  "arguments": {
    "color": "rgba(255, 0, 0, 0.5)",
    "format": "hex"
  }
}
// Returns: "#ff0000"

将RGBA转换为OkLCH（保留alpha）：

{
  "tool": "convert",
  "arguments": {
    "color": "rgba(255, 0, 0, 0.5)",
    "format": "oklch"
  }
}
// Returns: "oklch(62.796% 0.25768 29.23494 / 0.5)"

点亮悬停状态的颜色：

{
  "tool": "lighten",
  "arguments": {
    "color": "#FF0000",
    "amount": 20
  }
}
// Returns: "#ff3333"

检查可访问性合规性：

{
  "tool": "compare",
  "arguments": {
    "foreground": "#000000",
    "background": "#FFFFFF"
  }
}
// Returns: {"contrast": 21, "compliant": 1, "normalAA": true, "normalAAA": true, ...}

生成设计系统样例：

{
  "tool": "swatch",
  "arguments": {
    "color": "#3B82F6"
  }
}
// Returns: {"50": "#eff6ff", "100": "#dbeafe", "200": "#bfdbfe", ..., "950": "#172554"}

发布和部署

NPM出版

此软件包已发布到NPM，可以与 npx:

npx -y mcp-color-convert@latest

要发布新版本，请执行以下操作：

1. 更新版本 package.json
2. 提交所有更改
3. 跑 npm publish （这将在发布前自动生成）

构建过程：

• TypeScript编译为 dist/ 目录
• 仅 dist/, src/, README.md，以及 LICENSE 包含在NPM包中

发展

设置开发环境

1. 克隆和安装依赖关系：

   git clone https://github.com/bennyzen/mcp-color-convert.git
   cd mcp-color-convert
   npm install

1. 在本地测试MCP服务器：

   # Test the server dry BEFORE trying to use it with an MCP client to catch obvious errors
   npx -y .

1. 在本地与您的代理（MCP客户端）一起使用：

- 更新您的MCP客户端配置以指向本地安装（例如。， npx -y /path/to/mcp-color-convert)

    {
      "mcpServers": {
        "color-converter": {
          "command": "npx",
          "args": [
            "-y",
            "/path/to/mcp-color-convert"
          ]
        }
      }
    }

重要提示：更改配置后重新启动MCP客户端！

1. 测试：

使用MCP客户端调用服务器并测试各种工具。您可以输入以下短语：

- “列出所有颜色转换工具” - “将#FF5733转换为HSL” - 将rgb（100、150、200）减少15% - “在oklch中创建红色调色板”

添加新工具

要添加新的颜色工具，请执行以下操作：

1. 按照现有示例编写工具函数
2. 使用注册工具 server.registerTool()
3. 使用Zod模式遵循现有的输入验证模式
4. 使用以下方式处理错误 McpError 用于一致的错误报告

依赖库

• @modelcontextprotocol/sdk -MCP服务器框架
• colorizr -颜色操作库（使用前验证导出）
• zod -输入验证模式

故障排除

服务器无法启动

• 确保已安装Node.js 18+： node --version
• 尝试清除npm缓存： npm cache clean --force
• 重新安装依赖关系： rm -rf node_modules package-lock.json && npm install

NPX执行问题

• 使用 -y 标记为自动安装： npx -y mcp-color-convert@latest
• 检查NPM注册表访问权限： npm ping
• 验证包是否存在： npm view mcp-color-convert

构建失败

• 确保已安装TypeScript： npm install
• 清洁构建： rm -rf dist/ .smithery/ && npm run build
• 检查TypeScript错误： npm run build:tsc

MCP客户端连接问题

• 配置更改后重新启动MCP客户端
• 验证服务器是否启动： node dist/index.js （应该挂起等待输入-这是正确的）
• 检查MCP客户端中的日志是否存在连接错误
• 确保客户端配置中的路径正确

颜色转换错误

• 验证颜色格式是否与支持的类型（十六进制、rgb、hsl、oklch、oklab）匹配
• 使用正确的语法检查alpha值（逗号表示rgba/hsla，斜线表示oklch/oklab）
• 命名颜色必须是有效的CSS颜色名称

许可证

MIT许可证。看 LICENSE 文件以获取详细信息。