The audit tool drives a locally installed Brave browser headless to render a page (or dev server URL) and measure the real painted background behind every piece of text, reporting contrast failures with fixes; the browser can be chosen via the OKLCHEMY_BROWSER setting.
Generates a Tailwind CSS 4 preset from a brand color as part of the palette tool, emitting contrast-safe oklch design tokens (page, surface, ink, muted, accent, on-accent, link, soft fills) with an optional dark scheme that pass both WCAG and APCA.
This server does not currently have a deployable release on Glama. Follow the repository's setup instructions to install and configure it for your MCP client, including any required credentials and local dependencies.
Color contrast that fixes itself, for coding agents.
Coding agents write colors blind: they pick a grey, ship it, and nobody measures it. oklchemy is a local MCP server and CLI that measures every text color the way a designer would, in WCAG 2 and APCA. When a color fails, it hands back the nearest one that passes, at the same hue, ready to paste. Hence the name: oklch, plus a little alchemy that turns failing colors into passing ones.
One command:
claude mcp add oklchemy -- npx -y github:brandonmlicea/oklchemyAny other MCP client (Cursor, Codex, Claude Desktop...):
{ "mcpServers": { "oklchemy": { "command": "npx", "args": ["-y", "github:brandonmlicea/oklchemy"] } } }Node.js 22.4 or newer, no dependencies. audit drives the Chrome, Edge, Brave or Chromium you already have, headless; set OKLCHEMY_BROWSER to pick one.
Related MCP server: WCAG Color Contrast MCP Server
Tool | What it does |
| Text and background pairs in any CSS color: hex, |
| One brand color in (a word, hex, |
| A page, from a dev server URL or an HTML file. Every piece of text is checked against what is really painted behind it: cards, translucent overlays, alpha, positioned layers that are not its parent, light and dark schemes. Failures come grouped, each with a fix; text on images, video or gradients is listed to check by eye. |
| Scores a single HTML page against a calm, minimal style (one short headline, few words, one font pairing, tokens over raw colors, no gradients, shadows or emoji) and lists fixes. |
The goal is AA by default: WCAG 4.5:1 and APCA Lc 60 for body text, 3:1 and Lc 45 for large text (24px, or 18.66px bold). AAA is 7:1 and Lc 75.
npx github:brandonmlicea/oklchemy check "#999" "#fff"
# fail #999 on #fff: 2.85:1, APCA Lc 54.6 (AA: WCAG 4.5 and APCA Lc 60). Large text and headlines.
# fix oklch(0.5675 0 0) (#767676): 4.51:1, Lc 71.3
npx github:brandonmlicea/oklchemy audit http://localhost:5173 --both
npx github:brandonmlicea/oklchemy palette 250 --style=paper --darkcheck and audit exit 1 when anything fails, so audit can gate a CI build.
Everything below runs from eval/ with no network and no dependencies:
Eval | Result |
| 203 of 203 match: WCAG within 0.0001, APCA within 0.001 Lc |
| 278 of 278 fixes pass, as |
| 10,080 of 10,080 text pairs in 1,008 palettes meet both WCAG and APCA |
| 17 of 17 judged right |
eval/reference.json was made with colorjs.io and apca-w3, which are not dependencies of oklchemy.
It opens the page in headless Chrome with reduced motion, so fade-ins settle, and stretches the viewport to the whole page. For each piece of text it asks the browser what is painted under the text, top to bottom, and blends every translucent layer down to the first opaque one, with the text's own alpha and its ancestors' opacity. It does not read text shadows, hover and focus states, or anything behind text on an image; those are yours to check.
WCAG 2 is the standard in law and procurement. APCA is the readability method in the draft WCAG 3: oklchemy reports both and passes a pair only when both are met, which is stricter than WCAG 2 alone.
audit checks one point per piece of text, so text that crosses two backgrounds is judged on the first.
English labels only; the colors do not care.
OKLab and OKLCH are Björn Ottosson's. APCA is Andrew Somers' (Myndex); oklchemy implements its published 0.0.98G constants and is not affiliated with it. palette began as the design system of a product of mine, and is shared here on its own.
MIT
This server cannot be deployed
WCAG color contrast checks, nearest accessible color, CSS color conversion and palette pair checks.
Contrast checks with fixes, OKLCH harmonies, palettes, color-blind previews and code export.
18 color tools: OKLCH, WCAG and APCA contrast fixes, palettes, gradients, color blindness, tokens.
Run accessibility, contrast, and design token audits and file QA issues from your AI coding tool.
