{
  "markdown": "# contrast-checker-mcp\n\nAn MCP server that provides color contrast checking tools for AI assistants. Verify WCAG 2.1 accessibility compliance, compute contrast ratios with alpha transparency support, and get accessible color suggestions — all via the standard [Model Context Protocol](https://modelcontextprotocol.io).\n\nContrast calculations match [WebAIM's contrast checker](https://webaim.org/resources/contrastchecker/) — including alpha compositing, WCAG `0.03928` sRGB threshold, and truncated (not rounded) ratios.\n\n## Tools\n\n### `check_contrast`\n\nCheck the contrast ratio between two colors and evaluate WCAG 2.1 compliance.\n\n**Inputs:**\n- `foreground` — Foreground color (e.g. `#333`, `rgb(0,0,0)`, `rgba(0,0,0,0.5)`, `navy`)\n- `background` — Background color (e.g. `#fff`, `rgb(255,255,255)`, `white`)\n\n**Output:** Contrast ratio, WCAG 2.1 pass/fail results (AA normal, AA large, AAA normal, AAA large), parsed color values. When the foreground has alpha, shows the effective composited color used for the calculation.\n\n### `suggest_accessible_color`\n\nSuggest a replacement color that meets a WCAG contrast target, keeping the hue as close to the original as possible.\n\n**Inputs:**\n- `foreground` — Foreground color\n- `background` — Background color\n- `target_level` — `\"AA\"` or `\"AAA\"` (default: `\"AA\"`)\n- `fix` — `\"foreground\"` or `\"background\"` (default: `\"foreground\"`)\n\n**Output:** A suggested replacement color (in hex, rgb, hsl) that meets the target level, along with the new contrast ratio.\n\n### `parse_color`\n\nParse a color string and return it in multiple formats.\n\n**Inputs:**\n- `color` — Color to parse (e.g. `#ff6600`, `rgb(255,102,0)`, `tomato`)\n\n**Output:** The color in hex, rgb, and hsl formats.\n\n## Supported Color Formats\n\n- Hex: `#rgb`, `#rrggbb`, `#rgba`, `#rrggbbaa`\n- RGB: `rgb(r, g, b)`, `rgba(r, g, b, a)`\n- HSL: `hsl(h, s%, l%)`, `hsla(h, s%, l%, a)`\n- CSS named colors: `red`, `cornflowerblue`, `rebeccapurple`, etc.\n\n## Setup\n\n### Claude Desktop\n\nAdd to `~/Library/Application Support/Claude/claude_desktop_config.json` (macOS) or `%APPDATA%\\Claude\\claude_desktop_config.json` (Windows):\n\n```json\n{\n  \"mcpServers\": {\n    \"contrast-checker\": {\n      \"command\": \"npx\",\n      \"args\": [\"-y\", \"contrast-checker-mcp\"]\n    }\n  }\n}\n```\n\n### Claude Code\n\n```bash\nclaude mcp add contrast-checker npx -y contrast-checker-mcp\n```\n\n### Cursor / VS Code\n\nAdd to `.cursor/mcp.json` or `.vscode/mcp.json`:\n\n```json\n{\n  \"servers\": {\n    \"contrast-checker\": {\n      \"command\": \"npx\",\n      \"args\": [\"-y\", \"contrast-checker-mcp\"]\n    }\n  }\n}\n```\n\n### From source\n\n```bash\ngit clone https://github.com/ogSINGH/contrast-checker-mcp.git\ncd contrast-checker-mcp\nnpm install\nnpm run build\nnode dist/index.js\n```\n\n## Examples\n\n**Black on white** — 21:1 ratio, all WCAG levels pass:\n```\ncheck_contrast({ foreground: \"#000000\", background: \"#ffffff\" })\n```\n\n**Semi-transparent text** — alpha composited onto background before checking:\n```\ncheck_contrast({ foreground: \"rgba(0,0,0,0.5)\", background: \"#ffffff\" })\n→ effective color #808080, ratio 3.94:1\n```\n\n**Fix a failing color pair:**\n```\nsuggest_accessible_color({\n  foreground: \"#777777\",\n  background: \"#ffffff\",\n  target_level: \"AA\"\n})\n→ suggests #757575 (4.61:1)\n```\n\n## License\n\nApache-2.0\n",
  "bytes": 3260,
  "sha": "243dbadf37b2c2a7455dd4a0c8111abe7e651a1878d0ec8815ac5686e4912a5d",
  "repo_slug": "ogsingh/contrast-checker-mcp",
  "fonte": "repo",
  "truncated": false,
  "api": "https://agentalog.com/api/listings/mcp_io_github_ogsingh_contrast_checker_mcp_61a6513b/readme"
}