← WebMCP Directory

Tool tree

colorcontrast.app

Developer ToolsTools verified
Website
Check the contrast between colors using WCAG or APCA and get suggestions for better colors in hex, RGB, HSL or HWB.
Explore capabilities
    check_color_contrastAction

    Check the contrast between a foreground and background color using WCAG 2 (contrast ratio) or APCA (Lc value), and get suggested accessible replacements. Also updates the colors and algorithm shown on the page. Returns: algorithm used; rating (WCAG ratio, or absolute APCA Lc); checks, an array with one entry per use (normalText, largeText, icons) giving the target rating and whether the rating passes it; and suggestions, a list of complete foreground/background pairs with the target it was generated for and the rating it achieves (the background is unchanged unless the foreground alone could not reach the target). An empty suggestions list means either the colors already pass for all text, or no accessible alternative could be found.

    View tool JSON
    {
      "name": "check_color_contrast",
      "kind": "act",
      "impl": "imperative",
      "description": "Check the contrast between a foreground and background color using WCAG 2 (contrast ratio) or APCA (Lc value), and get suggested accessible replacements. Also updates the colors and algorithm shown on the page. Returns: algorithm used; rating (WCAG ratio, or absolute APCA Lc); checks, an array with one entry per use (normalText, largeText, icons) giving the target rating and whether the rating passes it; and suggestions, a list of complete foreground/background pairs with the target it was generated for and the rating it achieves (the background is unchanged unless the foreground alone could not reach the target). An empty suggestions list means either the colors already pass for all text, or no accessible alternative could be found.",
      "inputSchema": {
        "type": "object",
        "properties": {
          "foreground": {
            "type": "string",
            "description": "Foreground (text) color in any CSS format, e.g. #107db5 or rgb(16 125 181)"
          },
          "background": {
            "type": "string",
            "description": "Background color in any CSS format. May include alpha."
          },
          "algorithm": {
            "type": "string",
            "enum": [
              "WCAG2",
              "APCA"
            ],
            "description": "Contrast algorithm. Defaults to WCAG2."
          },
          "level": {
            "type": "string",
            "enum": [
              "aa",
              "aaa"
            ],
            "description": "WCAG2 conformance level. Defaults to aa."
          }
        },
        "required": [
          "foreground",
          "background"
        ]
      }
    }