{"uid":"cap_CTq12m0vRuOEPoeOhuWwV","slug":"wcag-2-1-contrast-ratio-checker-4eac02e1","name":"WCAG 2.1 Contrast Ratio Checker","description":"Compute the WCAG 2.1 contrast ratio between a foreground and background color and report AA/AAA pass/fail for normal and large text.","url":"https://api.24klabs.ai/api/wcag-contrast?utm_source=zero.xyz","method":"POST","headers":{},"bodySchema":{"type":"object","properties":{"bg":{"type":"string"},"fg":{"type":"string"}}},"responseSchema":{"type":"json","example":{"ratio":4.48,"AA_normal":true,"AAA_normal":false}},"example":null,"exampleRequest":null,"tags":["x402"],"displayCostAmount":"0.002","displayCostAsset":"USDC","priceDynamic":false,"priceHint":null,"priceStatus":"priced","priceSource":"probe","requiresHandshake":false,"reviewCount":0,"rating":{"score":"0.00","successRate":"0.00","reviews":0,"stars":null,"state":"unrated"},"availabilityStatus":"unknown","priceObserved":null,"sessionDeposit":null,"pricing":{"kind":"static","summary":"$0.002/call","primary":{"kind":"static","protocol":"x402","network":"base","amountUsd":"0.002","per":"call","confidence":"exact"},"accepted":[{"kind":"static","protocol":"x402","network":"base","amountUsd":"0.002","per":"call","confidence":"exact"}]},"paymentMethods":[{"uid":"pm_8TuiCl_y9RT7rZnICf-Xc","protocol":"x402","methodType":"crypto","chain":"base","mode":"charge","costAmount":"0.002","costPer":"request","priority":0,"asset":"0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913","unit":"request","depositMicros":null,"planRef":null}],"brandName":null,"brandSlug":null,"brandBaseUrl":null,"brandDocsUrl":null,"whatItDoes":"Computes the WCAG 2.1 contrast ratio between two colors and reports AA/AAA pass/fail status for normal and large text.","exampleAgentPrompt":"Can you check whether white text (#FFFFFF) on a navy background (#1A237E) passes WCAG 2.1 AA and AAA standards for both normal and large text?","exampleUseCases":[{"title":"Design system accessibility audit","prompt":"I'm building a design system and need to know if our brand colors pass WCAG — check if #333333 text on a #F5F5F5 background meets AA and AAA for normal and large text."},{"title":"Accessible button label validation","prompt":"Does the button label color #FFFFFF on our primary brand background #0057B8 pass WCAG 2.1 AA accessibility for normal-sized text?"},{"title":"Dark mode color compliance check","prompt":"We're launching a dark mode — can you verify that our foreground color #E0E0E0 on background #121212 passes WCAG AAA contrast requirements for large text?"}],"resultDescription":"Returns the numeric WCAG 2.1 contrast ratio (e.g. 4.5:1) between the foreground and background color, along with boolean pass/fail indicators for AA and AAA compliance levels at both normal text (4.5:1 and 7:1 thresholds) and large text (3:1 and 4.5:1 thresholds).","failureModes":["Invalid color format provided (non-hex, malformed RGB) returns a 400 error","Missing foreground or background parameter returns validation error","Identical foreground and background colors returns a contrast ratio of 1:1 with all fail results","Unsupported color space or alpha channel values may not be handled correctly"],"whenToPreferThis":"Choose this endpoint when you need a programmatic, standards-accurate WCAG 2.1 contrast ratio computation with explicit AA/AAA pass/fail verdicts for both normal and large text. Prefer it over manual calculations or generic color tools when building automated accessibility audits, CI/CD design checks, or agent workflows that need structured pass/fail output.","instructions":null,"reviewSummary":null,"reviewSummaryHighlights":null,"reviewSummaryConcerns":null,"reviewSummaryGeneratedAt":null,"activationCount":0,"lastUsedAt":null,"lastSuccessfullyRanAt":null,"lastHealthCheckAt":"2026-10-12T18:49:10.482Z","isFirstParty":false,"canonicalSlug":"wcag-2-1-contrast-ratio-checker-8f3e318d"}