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,002トークン数（ツール定義）
~4.1 KB一般的なレスポンスサイズ
注意への影響は中程度（128k コンテキストの 1.56%）

これは、サーバーのツールがモデルのコンテキストに読み込まれるたびに消費されるおおよそのトークン数です。数が多いほど、ほかのタスクに使える注意が減ります。

インストール

ワンクリックインストール

これを `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 件