MCP MeasureMCP Measure

索引已观测

ContrastKit

WCAG color contrast checks, nearest accessible color, CSS color conversion and palette pair checks.

我该使用它吗

质量与安全性

A
描述质量
100%
模式完整度
100%
命名质量
95%
投毒风险
100%
权限匹配度
100%
协议合规性
100%

基于对工具定义和协议合规性的自动分析。

上下文开销

~2,002token 数（工具定义）
~4.1 KB典型响应大小
对注意力有中等影响（占 128k 上下文窗口的 1.56%）

这是每次将服务器的工具加载到模型上下文窗口时所消耗的大致 token 数。数值越高，可用于其他任务的注意力就越少。

安装

一键安装

将以下内容添加到你的 `claude_desktop_config.json` 文件中：

{
  "mcpServers": {
    "contrastkit": {
      "url": "https://contrastkit.mike-tusa.workers.dev/mcp"
    }
  }
}

远程端点

https://contrastkit.mike-tusa.workers.dev/mcpstreamable-http

它能做什么

工具清单

工具（4）

🟢 只读🟡 写入🔴 删除⚪ 未知
🟢check_contrast(foreground, background)

Compute the WCAG 2.x contrast ratio between a text (foreground) color and a background color, with pass/fail for AA, AA large text, AAA, AAA large text and non-text UI (3:1). Handles translucent colors. Read-only. Same engine as GET /api/contrast.

输入模式

{
  "type": "object",
  "properties": {
    "foreground": {
      "type": "string",
      "minLength": 1,
      "maxLength": 64,
      "description": "Text / foreground color as a CSS color: \"#1a73e8\", \"#fff\", \"rgb(26 115 232)\", \"hsl(217 80% 51%)\", \"rgba(0,0,0,.6)\" or a name like \"navy\"."
    },
    "background": {
      "type": "string",
      "minLength": 1,
      "maxLength": 64,
      "description": "Background color as a CSS color: \"#1a73e8\", \"#fff\", \"rgb(26 115 232)\", \"hsl(217 80% 51%)\", \"rgba(0,0,0,.6)\" or a name like \"navy\"."
    }
  },
  "required": [
    "foreground",
    "background"
  ],
  "additionalProperties": false
}

输出模式

{
  "type": "object",
  "properties": {
    "foreground": {
      "type": "object",
      "properties": {
        "hex": {
          "type": "string"
        },
        "rgb": {
          "type": "string"
        },
        "hsl": {
          "type": "string"
        },
        "alpha": {
          "type": "number"
        },
        "luminance": {
          "type": "number"
        }
      },
      "required": [
        "hex",
        "rgb",
        "hsl",
        "alpha",
        "luminance"
      ]
    },
    "background": {
      "type": "object",
      "properties": {
        "hex": {
          "type": "string"
        },
        "rgb": {
          "type": "string"
        },
        "hsl": {
          "type": "string"
        },
        "alpha": {
          "type": "number"
        },
        "luminance": {
          "type": "number"
        }
      },
      "required": [
        "hex",
        "rgb",
        "hsl",
        "alpha",
        "luminance"
      ]
    },
    "effectiveForeground": {
      "type": "string"
    },
    "effectiveBackground": {
      "type": "string"
    },
    "ratio": {
      "type": "number"
    },
    "ratioExact": {
      "type": "number"
    },
    "pass": {
      "type": "object",
      "properties": {
        "aa": {
          "type": "boolean"
        },
        "aa_large": {
          "type": "boolean"
        },
        "aaa": {
          "type": "boolean"
        },
        "aaa_large": {
          "type": "boolean"
        },
        "ui": {
          "type": "boolean"
        }
      },
      "required": [
        "aa",
        "aa_large",
        "aaa",
        "aaa_large",
        "ui"
      ]
    },
    "notes": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "version": {
      "type": "string"
    }
  },
  "required": [
    "ratio",
    "pass",
    "notes",
    "version"
  ]
}
🟢suggest_accessible_color(foreground, background, level, adjust)

For a failing color pair, find the closest color (same hue and saturation, lightness changed as little as possible) that meets the chosen WCAG level. Adjust the foreground (default), the background, or both (best first). Read-only. Same engine as GET /api/suggest.

输入模式

{
  "type": "object",
  "properties": {
    "foreground": {
      "type": "string",
      "minLength": 1,
      "maxLength": 64,
      "description": "Text / foreground color as a CSS color: \"#1a73e8\", \"#fff\", \"rgb(26 115 232)\", \"hsl(217 80% 51%)\", \"rgba(0,0,0,.6)\" or a name like \"navy\"."
    },
    "background": {
      "type": "string",
      "minLength": 1,
      "maxLength": 64,
      "description": "Background color as a CSS color: \"#1a73e8\", \"#fff\", \"rgb(26 115 232)\", \"hsl(217 80% 51%)\", \"rgba(0,0,0,.6)\" or a name like \"navy\"."
    },
    "level": {
      "type": "string",
      "enum": [
        "aa",
        "aa-large",
        "aaa",
        "aaa-large",
        "ui"
      ],
      "default": "aa",
      "description": "WCAG target: aa 4.5:1 (default), aa-large 3:1, aaa 7:1, aaa-large 4.5:1, ui 3:1 (non-text)."
    },
    "adjust": {
      "type": "string",
      "enum": [
        "foreground",
        "background",
        "both"
      ],
      "default": "foreground",
      "description": "Which color may change."
    }
  },
  "required": [
    "foreground",
    "background"
  ],
  "additionalProperties": false
}

输出模式

{
  "type": "object",
  "properties": {
    "foreground": {
      "type": "object",
      "properties": {
        "hex": {
          "type": "string"
        },
        "rgb": {
          "type": "string"
        },
        "hsl": {
          "type": "string"
        },
        "alpha": {
          "type": "number"
        },
        "luminance": {
          "type": "number"
        }
      },
      "required": [
        "hex",
        "rgb",
        "hsl",
        "alpha",
        "luminance"
      ]
    },
    "background": {
      "type": "object",
      "properties": {
        "hex": {
          "type": "string"
        },
        "rgb": {
          "type": "string"
        },
        "hsl": {
          "type": "string"
        },
        "alpha": {
          "type": "number"
        },
        "luminance": {
          "type": "number"
        }
      },
      "required": [
        "hex",
        "rgb",
        "hsl",
        "alpha",
        "luminance"
      ]
    },
    "effectiveForeground": {
      "type": "string"
    },
    "effectiveBackground": {
      "type": "string"
    },
    "ratio": {
      "type": "number"
    },
    "ratioExact": {
      "type": "number"
    },
    "pass": {
      "type": "object",
      "properties": {
        "aa": {
          "type": "boolean"
        },
        "aa_large": {
          "type": "boolean"
        },
        "aaa": {
          "type": "boolean"
        },
        "aaa_large": {
          "type": "boolean"
        },
        "ui": {
          "type": "boolean"
        }
      },
      "required": [
        "aa",
        "aa_large",
        "aaa",
        "aaa_large",
        "ui"
      ]
    },
    "notes": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "version": {
      "type": "string"
    },
    "level": {
      "type": "string"
    },
    "target": {
      "type": "number"
    },
    "adjust": {
      "type": "string"
    },
    "alreadyPasses": {
      "type": "boolean"
    },
    "suggestions": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "adjust": {
            "type": "string"
          },
          "color": {
            "type": "object",
            "properties": {
              "hex": {
                "type": "string"
              },
              "rgb": {
                "type": "string"
              },
              "hsl": {
                "type": "string"
              },
              "alpha": {
                "type": "number"
              },
              "luminance": {
                "type": "number"
              }
            },
            "required": [
              "hex",
              "rgb",
              "hsl",
              "alpha",
              "luminance"
            ]
          },
          "ratio": {
            "type": "number"
          },
          "lightnessChange": {
            "type": "number"
          }
        }
      }
    }
  },
  "required": [
    "ratio",
    "target",
    "alreadyPasses",
    "suggestions",
    "version"
  ]
}
🟢convert_color(color)

Convert a CSS color to hex, rgb() and hsl(), with its relative luminance, its contrast on white and on black, and the better text color (black or white) to put on it. Read-only. Same engine as GET /api/convert.

输入模式

{
  "type": "object",
  "properties": {
    "color": {
      "type": "string",
      "minLength": 1,
      "maxLength": 64,
      "description": "Color as a CSS color: \"#1a73e8\", \"#fff\", \"rgb(26 115 232)\", \"hsl(217 80% 51%)\", \"rgba(0,0,0,.6)\" or a name like \"navy\"."
    }
  },
  "required": [
    "color"
  ],
  "additionalProperties": false
}

输出模式

{
  "type": "object",
  "properties": {
    "input": {
      "type": "string"
    },
    "hex": {
      "type": "string"
    },
    "rgb": {
      "type": "string"
    },
    "hsl": {
      "type": "string"
    },
    "alpha": {
      "type": "number"
    },
    "luminance": {
      "type": "number"
    },
    "contrastOnWhite": {
      "type": "number"
    },
    "contrastOnBlack": {
      "type": "number"
    },
    "bestTextColor": {
      "type": "string"
    },
    "version": {
      "type": "string"
    }
  },
  "required": [
    "hex",
    "luminance",
    "bestTextColor",
    "version"
  ]
}
🟢check_palette(colors, level)

Contrast ratio for every pair of 2 to 12 colors (up to 66 pairs), highest first, each flagged against the chosen WCAG level. Use it to see which brand colors can be used together for text. Read-only. Same engine as GET /api/palette.

输入模式

{
  "type": "object",
  "properties": {
    "colors": {
      "type": "array",
      "minItems": 2,
      "maxItems": 12,
      "items": {
        "type": "string",
        "minLength": 1,
        "maxLength": 64,
        "description": "Palette color as a CSS color: \"#1a73e8\", \"#fff\", \"rgb(26 115 232)\", \"hsl(217 80% 51%)\", \"rgba(0,0,0,.6)\" or a name like \"navy\"."
      },
      "description": "2 to 12 CSS colors."
    },
    "level": {
      "type": "string",
      "enum": [
        "aa",
        "aa-large",
        "aaa",
        "aaa-large",
        "ui"
      ],
      "default": "aa",
      "description": "WCAG target: aa 4.5:1 (default), aa-large 3:1, aaa 7:1, aaa-large 4.5:1, ui 3:1 (non-text)."
    }
  },
  "required": [
    "colors"
  ],
  "additionalProperties": false
}

输出模式

{
  "type": "object",
  "properties": {
    "level": {
      "type": "string"
    },
    "target": {
      "type": "number"
    },
    "colors": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "count": {
      "type": "integer"
    },
    "passing": {
      "type": "integer"
    },
    "pairs": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "a": {
            "type": "string"
          },
          "b": {
            "type": "string"
          },
          "ratio": {
            "type": "number"
          },
          "passes": {
            "type": "boolean"
          }
        }
      }
    },
    "notes": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "version": {
      "type": "string"
    }
  },
  "required": [
    "pairs",
    "count",
    "passing",
    "version"
  ]
}

社区

评价此服务器

证据

最近观测

已验证未记录版本4 个工具