WCAG 2.1 contrast audit with the maths baked in: for each foreground/background pair the renderer computes the relative luminance and contrast ratio, shows a live sample swatch, and badges AA (4.5:1), AA large (3:1) and AAA (7:1) as pass or fail. Failing pairs get the nearest passing colour, found by mixing the foreground toward black or white in 5% steps until it clears AA. A summary line counts the passes. For an agent composing a surface this is the difference between "looks fine" and "is readable". No JavaScript; light or dark.
| Surface | Note |
|---|---|
| google-chat | Renders as a plain text card; the typographic layout is lost |
| Field | Type | Required |
|---|---|---|
| pairs | array of {fg, bg, label?}. Up to 12 pairs of "#rrggbb" colours; invalid pairs are dropped. | optional |
| fg | "#rrggbb". Single-pair shorthand when pairs is absent. | optional |
| bg | "#rrggbb". Single-pair shorthand when pairs is absent. | optional |
| label | string. Label for the single-pair shorthand. | optional |
| show_fix | bool. Suggest the nearest passing foreground for failures. Default true. | optional |
| theme | "dark" | "light" (optional, default "light") | optional |
{
"type": "contrast_audit"
}
{
"identifier": "urn:air:a2uicatalog.ai:atom:contrast_audit",
"displayName": "Contrast Audit",
"type": "application/vnd.a2ui.atom+json",
"url": "https://a2uicatalog.ai/atoms/contrast_audit",
"capabilities": [
"web",
"google-meet-stage",
"google-apps-script-web",
"mcp-apps",
"pdf",
"android"
],
"description": "WCAG 2.1 contrast audit with the maths baked in: for each foreground/background pair the renderer computes the relative luminance and contrast ratio, shows a live sample swatch, and badges AA (4.5:1), AA large (3:1) and AAA (7:1) as pass or fail. Failing pairs get the nearest passing colour, found by mixing the foreground toward black or white in 5% steps until it clears AA. A summary line counts the passes. For an agent composing a surface this is the difference between \"looks fine\" and \"is readable\". No JavaScript; light or dark.",
"representativeQueries": [
"show a WCAG contrast ratios for colour pairs with AA/AAA badges and a nearest-passing fix",
"wcag 2.1 contrast audit with the maths baked in: for each foreground/background pair the renderer co",
"render a contrast audit"
]
}
The renderer is an open-source Google Apps Script web app. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.
git clone https://github.com/a2uicatalog/a2ui
cd a2ui/apps-script-surface/gas-wired-renderer
clasp push && clasp deploy
Full deploy guide →