Koskamo

Zovo Palette Lab MCP

Zovo Palette Lab is a WCAG color contrast checker and accessible color palette generator for designers, front-end developers and accessibility reviewers. It computes the WCAG 2.x contrast ratio for text and UI colours, shows AA and AAA results, suggests nearest passing colours, tests palette pairs, and builds tonal scales with CSS variables and Tailwind config.

Visit Zovo

Endpoint and access

No sign-in to connect and list tools. Individual tools may still need a vendor account, credentials, or permissions; check the documented prerequisites.

Zovo Palette Lab MCP logo, by ZovoCommunity listingStreamable HTTPNo sign-inEndpoint checked 2026-11-01Published by Zovo
MCP endpoint (Streamable HTTP)
https://contrast-checker.zovo.one/mcp
Vendor documentation

What you can do with it

  • Check WCAG contrast for text and UI colors
  • Test pairs in a color palette
  • Generate accessible 50-950 color scales
  • Get nearest passing colors for AA/AAA

Source and maintenance

Community listingRegistry 1.0.0
mcp-registry: io.github.theluckystrike/contrast-checker@1.0.0Project website

Protocol and capabilities

Server
contrast-checker 1.0.0
MCP protocol
2025-06-18
Tools
3 advertised
Resources
1 advertised
Resource templates
1 advertised
Prompts
Not advertised
Server-advertised capabilities
{
  "tools": {
    "listChanged": true
  },
  "resources": {
    "listChanged": true
  }
}

Server-provided instructions

Untrusted server output shown for inspection. It is not Koskamo guidance and is excluded from knowledge search.

Zovo Palette Lab computes exact WCAG 2.x colour contrast. check_color_contrast tests one text/background pair and suggests the nearest passing colours; check_palette_contrast tests each pair in a palette; generate_accessible_palette builds a 50-950 OKLCH scale with documented AA/AAA steps and CSS/Tailwind downloads. Ratios are truncated, rounded down. APCA is informational only.

Tools

3 advertised

check_color_contrast — Check color contrast
Advertised by the server during the last successful anonymous check.
Advertised read-only

Use this when the user wants to know whether a text, icon or border colour has enough contrast against a background: a WCAG contrast checker for one colour pair (e.g. "does white text on #F59E0B pass WCAG AA", "contrast ratio of #767676 on white", "what text color for this background"). Returns the computed WCAG 2.x ratio (truncated to 2 decimals, rounded down), AA/AAA results for normal text, large text and UI components, a verdict for a given font size, APCA Lc as draft information, and the nearest passing colours for AA and AAA (darker and lighter, same OKLCH hue and chroma). Accepts hex, 8-digit hex with alpha, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color(display-p3 ...) and CSS colour names; wide-gamut colours are clipped to sRGB with a note. Does not read colours from images or web pages, resolve CSS variables or currentColor, or check gradients as a whole (check each stop). For 3 or more colours use check_palette_contrast.

check_color_contrast input schema
{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "foreground",
    "background"
  ],
  "properties": {
    "bold": {
      "type": "boolean",
      "description": "Optional: true when that text is bold (font-weight 700+), e.g. true. Bold text from 18.66px counts as large text."
    },
    "adjust": {
      "enum": [
        "auto",
        "foreground",
        "background"
      ],
      "type": "string",
      "description": "Which colour the suggested fixes change, e.g. foreground. auto (default) changes the more colourful of the two, so brand colours keep their hue."
    },
    "background": {
      "type": "string",
      "maxLength": 64,
      "minLength": 1,
      "description": "Background colour behind it, e.g. #FFFFFF, white or #1E293B. A translucent background is composited over white."
    },
    "foreground": {
      "type": "string",
      "maxLength": 64,
      "minLength": 1,
      "description": "Text, icon or border colour, e.g. #767676, #1E6FD980 (8-digit hex with alpha), rgb(118, 118, 118), hsl(214 76% 48%), oklch(55% 0.18 255) or a CSS colour name such as navy. Translucent colours are composited over the background."
    },
    "font_size_px": {
      "type": "number",
      "maximum": 500,
      "minimum": 1,
      "description": "Optional text size in CSS pixels for a single verdict on that text, e.g. 16. 18pt = 24px; 14pt = about 18.66px."
    }
  }
}
check_color_contrast output schema
{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "kind",
    "foreground",
    "background",
    "ratio",
    "ratio_4dp",
    "wcag",
    "your_text",
    "apca",
    "fixes",
    "warnings",
    "request"
  ],
  "properties": {
    "apca": {
      "type": "object",
      "required": [
        "lc",
        "polarity",
        "note"
      ],
      "properties": {
        "lc": {
          "type": "number"
        },
        "note": {
          "type": "string"
        },
        "polarity": {
          "type": "string"
        }
      },
      "additionalProperties": false
    },
    "kind": {
      "type": "string",
      "const": "contrast"
    },
    "wcag": {
      "type": "object",
      "required": [
        "aa_normal",
        "aaa_normal",
        "aa_large",
        "aaa_large",
        "ui_components"
      ],
      "properties": {
        "aa_large": {
          "type": "object",
          "required": [
            "min",
            "pass"
          ],
          "properties": {
            "min": {
              "type": "number"
            },
            "pass": {
              "type": "boolean"
            }
          },
          "additionalProperties": false
        },
        "aa_normal": {
          "type": "object",
          "required": [
            "min",
            "pass"
          ],
          "properties": {
            "min": {
              "type": "number"
            },
            "pass": {
              "type": "boolean"
            }
          },
          "additionalProperties": false
        },
        "aaa_large": {
          "type": "object",
          "required": [
            "min",
            "pass"
          ],
          "properties": {
            "min": {
              "type": "number"
            },
            "pass": {
              "type": "boolean"
            }
          },
          "additionalProperties": false
        },
        "aaa_normal": {
          "type": "object",
          "required": [
            "min",
            "pass"
          ],
          "properties": {
            "min": {
              "type": "number"
            },
            "pass": {
              "type": "boolean"
            }
          },
          "additionalProperties": false
        },
        "ui_components": {
          "type": "object",
          "required": [
            "min",
            "pass"
          ],
          "properties": {
            "min": {
              "type": "number"
            },
            "pass": {
              "type": "boolean"
            }
          },
          "additionalProperties": false
        }
      },
      "additionalProperties": false
    },
    "fixes": {
      "type": "object",
      "required": [
        "adjusting",
        "kept",
        "aa",
        "aaa"
      ],
      "properties": {
        "aa": {
          "type": "object",
          "required": [
            "darker",
            "lighter"
          ],
          "properties": {
            "darker": {
              "anyOf": [
                {
                  "type": "object",
                  "required": [
                    "hex",
                    "ratio",
                    "oklch",
                    "lightness_change",
                    "chroma_reduced",
                    "unchanged"
                  ],
                  "properties": {
                    "hex": {
                      "type": "string"
                    },
                    "oklch": {
                      "type": "string"
                    },
                    "ratio": {
                      "type": "number"
                    },
                    "unchanged": {
                      "type": "boolean"
                    },
                    "chroma_reduced": {
                      "type": "boolean"
                    },
                    "lightness_change": {
                      "type": "number"
                    }
                  },
                  "additionalProperties": false
                },
                {
                  "type": "null"
                }
              ]
            },
            "lighter": {
              "anyOf": [
                {
                  "type": "object",
                  "required": [
                    "hex",
                    "ratio",
                    "oklch",
                    "lightness_change",
                    "chroma_reduced",
                    "unchanged"
                  ],
                  "properties": {
                    "hex": {
                      "type": "string"
                    },
                    "oklch": {
                      "type": "string"
                    },
                    "ratio": {
                      "type": "number"
                    },
                    "unchanged": {
                      "type": "boolean"
                    },
                    "chroma_reduced": {
                      "type": "boolean"
                    },
                    "lightness_change": {
                      "type": "number"
                    }
                  },
                  "additionalProperties": false
                },
                {
                  "type": "null"
                }
              ]
            }
          },
          "additionalProperties": false
        },
        "aaa": {
          "type": "object",
          "required": [
            "darker",
            "lighter"
          ],
          "properties": {
            "darker": {
              "anyOf": [
                {
                  "type": "object",
                  "required": [
                    "hex",
                    "ratio",
                    "oklch",
                    "lightness_change",
                    "chroma_reduced",
                    "unchanged"
                  ],
                  "properties": {
                    "hex": {
                      "type": "string"
                    },
                    "oklch": {
                      "type": "string"
                    },
                    "ratio": {
                      "type": "number"
                    },
                    "unchanged": {
                      "type": "boolean"
                    },
                    "chroma_reduced": {
                      "type": "boolean"
                    },
                    "lightness_change": {
                      "type": "number"
                    }
                  },
                  "additionalProperties": false
                },
                {
                  "type": "null"
                }
              ]
            },
            "lighter": {
              "anyOf": [
                {
                  "type": "object",
                  "required": [
                    "hex",
                    "ratio",
                    "oklch",
                    "lightness_change",
                    "chroma_reduced",
                    "unchanged"
                  ],
                  "properties": {
                    "hex": {
                      "type": "string"
                    },
                    "oklch": {
                      "type": "string"
                    },
                    "ratio": {
                      "type": "number"
                    },
                    "unchanged": {
                      "type": "boolean"
                    },
                    "chroma_reduced": {
                      "type": "boolean"
                    },
                    "lightness_change": {
                      "type": "number"
                    }
                  },
                  "additionalProperties": false
                },
                {
                  "type": "null"
                }
              ]
            }
          },
          "additionalProperties": false
        },
        "kept": {
          "type": "string"
        },
        "adjusting": {
          "type": "string"
        }
      },
      "additionalProperties": false
    },
    "ratio": {
      "type": "number"
    },
    "request": {
      "type": "object",
      "propertyNames": {
        "type": "string"
      },
      "additionalProperties": {}
    },
    "warnings": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "ratio_4dp": {
      "type": "number"
    },
    "your_text": {
      "anyOf": [
        {
          "type": "object",
          "required": [
            "size_px",
            "bold",
            "category",
            "aa",
            "aaa"
          ],
          "properties": {
            "aa": {
              "type": "object",
              "required": [
                "min",
                "pass"
              ],
              "properties": {
                "min": {
                  "type": "number"
                },
                "pass": {
                  "type": "boolean"
                }
              },
              "additionalProperties": false
            },
            "aaa": {
              "type": "object",
              "required": [
                "min",
                "pass"
              ],
              "properties": {
                "min": {
                  "type": "number"
                },
                "pass": {
                  "type": "boolean"
                }
              },
              "additionalProperties": false
            },
            "bold": {
              "type": "boolean"
            },
            "size_px": {
              "type": "number"
            },
            "category": {
              "type": "string"
            }
          },
          "additionalProperties": false
        },
        {
          "type": "null"
        }
      ]
    },
    "background": {
      "type": "object",
      "required": [
        "input",
        "hex"
      ],
      "properties": {
        "hex": {
          "type": "string"
        },
        "input": {
          "type": "string"
        }
      },
      "additionalProperties": false
    },
    "foreground": {
      "type": "object",
      "required": [
        "input",
        "hex",
        "alpha",
        "painted"
      ],
      "properties": {
        "hex": {
          "type": "string"
        },
        "alpha": {
          "type": "number"
        },
        "input": {
          "type": "string"
        },
        "painted": {
          "type": "string"
        }
      },
      "additionalProperties": false
    }
  },
  "additionalProperties": false
}
check_color_contrast annotations
{
  "title": "Check color contrast",
  "readOnlyHint": true,
  "openWorldHint": false,
  "idempotentHint": true,
  "destructiveHint": false
}
check_palette_contrast — Check palette contrast
Advertised by the server during the last successful anonymous check.
Advertised read-only

Use this when the user has a colour palette (2 to 12 colours) and wants to know which combinations are accessible: "check contrast of my color palette", "which of these colors can I use for text", "accessible color palette checker". Returns the full pairwise WCAG 2.x contrast matrix (ratios truncated, rounded down), which pairs pass AA/AAA for text or 3:1 for large text and UI, and a recommended text colour for each background (a palette colour that passes AA, otherwise black or white). Does not generate new colours; use generate_accessible_palette for a tonal scale and check_color_contrast for fixes to one pair.

check_palette_contrast input schema
{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "colors"
  ],
  "properties": {
    "names": {
      "type": "array",
      "items": {
        "type": "string",
        "maxLength": 40
      },
      "maxItems": 12,
      "description": "Optional labels in the same order as colors, e.g. [\"Primary\", \"Accent\", \"Surface\", \"Ink\"]."
    },
    "colors": {
      "type": "array",
      "items": {
        "type": "string",
        "maxLength": 64,
        "minLength": 1
      },
      "maxItems": 12,
      "minItems": 2,
      "description": "2 to 12 colours to test against each other, e.g. [\"#1E6FD9\", \"#F59E0B\", \"#FFFFFF\", \"#111827\"]. Hex, rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch(), color(display-p3 ...) or CSS names; translucent colours are composited over white."
    }
  }
}
check_palette_contrast output schema
{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "kind",
    "colors",
    "matrix",
    "summary",
    "text_pairs",
    "best_text",
    "warnings",
    "request"
  ],
  "properties": {
    "kind": {
      "type": "string",
      "const": "palette"
    },
    "colors": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "name",
          "hex",
          "input"
        ],
        "properties": {
          "hex": {
            "type": "string"
          },
          "name": {
            "type": "string"
          },
          "input": {
            "type": "string"
          }
        },
        "additionalProperties": false
      }
    },
    "matrix": {
      "type": "array",
      "items": {
        "type": "array",
        "items": {
          "type": "number"
        }
      }
    },
    "request": {
      "type": "object",
      "propertyNames": {
        "type": "string"
      },
      "additionalProperties": {}
    },
    "summary": {
      "type": "object",
      "required": [
        "pairs",
        "aaa_text",
        "aa_text",
        "large_text_and_ui_only",
        "fail"
      ],
      "properties": {
        "fail": {
          "type": "number"
        },
        "pairs": {
          "type": "number"
        },
        "aa_text": {
          "type": "number"
        },
        "aaa_text": {
          "type": "number"
        },
        "large_text_and_ui_only": {
          "type": "number"
        }
      },
      "additionalProperties": false
    },
    "warnings": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "best_text": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "background",
          "recommended",
          "recommended_name",
          "ratio",
          "level",
          "source",
          "on_black",
          "on_white",
          "best_palette",
          "best_palette_ratio"
        ],
        "properties": {
          "level": {
            "type": "string"
          },
          "ratio": {
            "type": "number"
          },
          "source": {
            "type": "string"
          },
          "on_black": {
            "type": "number"
          },
          "on_white": {
            "type": "number"
          },
          "background": {
            "type": "number"
          },
          "recommended": {
            "type": "string"
          },
          "best_palette": {
            "type": [
              "number",
              "null"
            ]
          },
          "recommended_name": {
            "type": "string"
          },
          "best_palette_ratio": {
            "type": [
              "number",
              "null"
            ]
          }
        },
        "additionalProperties": false
      }
    },
    "text_pairs": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "a",
          "b",
          "ratio",
          "level"
        ],
        "properties": {
          "a": {
            "type": "number"
          },
          "b": {
            "type": "number"
          },
          "level": {
            "type": "string"
          },
          "ratio": {
            "type": "number"
          }
        },
        "additionalProperties": false
      }
    }
  },
  "additionalProperties": false
}
check_palette_contrast annotations
{
  "title": "Check palette contrast",
  "readOnlyHint": true,
  "openWorldHint": false,
  "idempotentHint": true,
  "destructiveHint": false
}
generate_accessible_palette — Generate accessible palette
Advertised by the server during the last successful anonymous check.
Advertised read-only

Use this when the user wants an accessible colour scale or palette built from one colour: "color palette generator from hex", "generate a 50-950 scale from #1E6FD9", "tailwind color palette generator", "accessible color palette for my website". Builds an 11-step 50-950 tonal scale in OKLCH with the base hue, where 50-400 pass AA with black text, 500 passes AA with both white and black text, 600 passes AA with white text and 700-950 pass AAA with white text, and each ratio is reported. Returns CSS custom properties and a Tailwind config as downloads. Does not pick colours by mood or brand meaning and does not extract palettes from images.

generate_accessible_palette input schema
{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "base_color"
  ],
  "properties": {
    "name": {
      "type": "string",
      "maxLength": 32,
      "description": "Token name for CSS variables and the Tailwind colour key, e.g. brand (gives --brand-500). Default brand."
    },
    "base_color": {
      "type": "string",
      "maxLength": 64,
      "minLength": 1,
      "description": "Brand or base colour to build the 50-950 scale from, e.g. #1E6FD9, rgb(30, 111, 217), oklch(55% 0.18 255) or teal."
    }
  }
}
generate_accessible_palette output schema
{
  "type": "object",
  "$schema": "http://json-schema.org/draft-07/schema#",
  "required": [
    "kind",
    "name",
    "base",
    "steps",
    "rules",
    "pairs",
    "css",
    "tailwind",
    "downloads",
    "warnings",
    "request"
  ],
  "properties": {
    "css": {
      "type": "string"
    },
    "base": {
      "type": "object",
      "required": [
        "input",
        "hex",
        "oklch",
        "on_white",
        "on_black",
        "nearest_step",
        "anchored"
      ],
      "properties": {
        "hex": {
          "type": "string"
        },
        "input": {
          "type": "string"
        },
        "oklch": {
          "type": "string"
        },
        "anchored": {
          "type": "boolean"
        },
        "on_black": {
          "type": "number"
        },
        "on_white": {
          "type": "number"
        },
        "nearest_step": {
          "type": "number"
        }
      },
      "additionalProperties": false
    },
    "kind": {
      "type": "string",
      "const": "scale"
    },
    "name": {
      "type": "string"
    },
    "pairs": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "text",
          "background",
          "ratio",
          "level"
        ],
        "properties": {
          "text": {
            "type": "number"
          },
          "level": {
            "type": "string"
          },
          "ratio": {
            "type": "number"
          },
          "background": {
            "type": "number"
          }
        },
        "additionalProperties": false
      }
    },
    "rules": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "steps": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "step",
          "hex",
          "oklch",
          "on_white",
          "on_black",
          "rule",
          "passes",
          "anchored",
          "chroma_reduced"
        ],
        "properties": {
          "hex": {
            "type": "string"
          },
          "rule": {
            "type": "string"
          },
          "step": {
            "type": "number"
          },
          "oklch": {
            "type": "string"
          },
          "passes": {
            "type": "boolean"
          },
          "anchored": {
            "type": "boolean"
          },
          "on_black": {
            "type": "number"
          },
          "on_white": {
            "type": "number"
          },
          "chroma_reduced": {
            "type": "boolean"
          }
        },
        "additionalProperties": false
      }
    },
    "request": {
      "type": "object",
      "propertyNames": {
        "type": "string"
      },
      "additionalProperties": {}
    },
    "tailwind": {
      "type": "string"
    },
    "warnings": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "downloads": {
      "type": "object",
      "required": [
        "css",
        "json"
      ],
      "properties": {
        "css": {
          "type": "string"
        },
        "json": {
          "type": "string"
        }
      },
      "additionalProperties": false
    }
  },
  "additionalProperties": false
}
generate_accessible_palette annotations
{
  "title": "Generate accessible palette",
  "readOnlyHint": true,
  "openWorldHint": false,
  "idempotentHint": true,
  "destructiveHint": false
}

Prompts

Not advertised

No prompt definitions available.

Resources

1 advertised

contrast-checker-widget — Zovo Palette Lab view

Advertised by the server during the last successful anonymous check.

Interactive view for Zovo Palette Lab.

contrast-checker-widget URI
ui://widget/contrast-checker-v1-1.0.0-e7d7b9a57ad979150622f79c2569d81d74d0e1ca2c1365788b5f45c217ef5ebb.html

MIME type: text/html;profile=mcp-app

contrast-checker-widget-legacy — Zovo Palette Lab view (previous versions)

Advertised by the server during the last successful anonymous check.

contrast-checker-widget-legacy URI template
ui://widget/contrast-checker-{version}.html

MIME type: text/html;profile=mcp-app

30-day availability

Aggregated from read-only remote checks; this is not a tool-execution or security guarantee.

Successful checks
1 of 1 (100%)
Average latency
470 ms
95th percentile latency
470 ms

Maintenance history

Public check and source-refresh events. Editorial and ownership records remain private.

  • · probe · passed · 470 ms · metadata changed · 3 tool(s), 1 resource(s), 1 resource template(s)

Connect from your client

Each snippet registers the same endpoint; pick the client you use.

This server is operated by the named third party. Listing and endpoint checks are not an endorsement or a security audit. Review the operator's permissions, terms, and data handling before connecting. How listings are checked and corrected.

Claude Code

Run this once in a terminal. It registers the remote server. Use --scope project to write .mcp.json for the repo.
Claude Code configuration
claude mcp add --transport http zovo-palette-lab-mcp https://contrast-checker.zovo.one/mcp

Codex

Run this once. Codex stores MCP servers in ~/.codex/config.toml (or .codex/config.toml in a trusted project).
Codex configuration
codex mcp add zovo-palette-lab-mcp --url https://contrast-checker.zovo.one/mcp

Cursor

Merge this server into .cursor/mcp.json in your project, then enable zovo-palette-lab-mcp in your MCP settings.
Cursor configuration
{
  "mcpServers": {
    "zovo-palette-lab-mcp": {
      "url": "https://contrast-checker.zovo.one/mcp"
    }
  }
}

Cline

Merge this into cline_mcp_settings.json (Cline → MCP Servers → Configure).
Cline configuration
{
  "mcpServers": {
    "zovo-palette-lab-mcp": {
      "type": "streamableHttp",
      "url": "https://contrast-checker.zovo.one/mcp",
      "disabled": false
    }
  }
}

VS Code

Merge this server into .vscode/mcp.json. Use MCP: List Servers to start zovo-palette-lab-mcp and inspect its tools.
VS Code configuration
{
  "servers": {
    "zovo-palette-lab-mcp": {
      "type": "http",
      "url": "https://contrast-checker.zovo.one/mcp"
    }
  }
}

Gemini CLI

Run this once. It writes .gemini/settings.json in the current project; pass --scope user for ~/.gemini/settings.json.
Gemini CLI configuration
gemini mcp add --transport http zovo-palette-lab-mcp https://contrast-checker.zovo.one/mcp

Claude Desktop

Merge this into claude_desktop_config.json (macOS: ~/Library/Application Support/Claude/, Windows: %APPDATA%\Claude\), then restart Claude Desktop.
Claude Desktop configuration
{
  "mcpServers": {
    "zovo-palette-lab-mcp": {
      "url": "https://contrast-checker.zovo.one/mcp"
    }
  }
}

Windsurf

Merge this into ~/.codeium/windsurf/mcp_config.json, then refresh MCP in Cascade. Windsurf remote servers use serverUrl, not url.
Windsurf configuration
{
  "mcpServers": {
    "zovo-palette-lab-mcp": {
      "serverUrl": "https://contrast-checker.zovo.one/mcp"
    }
  }
}

Let your agent find its tools

Find servers like Zovo Palette Lab MCP from your agent. Add Koskamo once to search the index for endpoints, access requirements, and client setup. Public discovery needs no key.

Connect Koskamo Explore workflows
See all 457