Contrast Checker (WCAG)
Check the contrast ratio between two colors and verify WCAG AA / AAA accessibility compliance.
Sample Heading
This paragraph shows how your text will look against the chosen background.
Small Bold Text (14pt bold counts as large text)
:1 contrast ratio
Good
Large text = 18pt (24px) regular or 14pt (18.67px) bold. WCAG 2.1 guidelines.
About this tool
WCAG (Web Content Accessibility Guidelines) defines contrast ratio requirements to ensure text is readable by people with low vision or color vision deficiencies. The contrast ratio is a number from 1:1 (no contrast, identical colors) to 21:1 (black text on white background). It is calculated from the relative luminance of the two colors — a perceptually weighted measure of brightness that accounts for how human eyes respond differently to red, green, and blue light.
WCAG 2.1 Level AA is the minimum standard for most public-facing websites and is a legal requirement in many jurisdictions. It requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold). Level AAA (7:1 for normal text, 4.5:1 for large text) is required for content that must be accessible to people with more severe vision impairments. UI components and graphical elements require at least 3:1 under Level AA.
Approximately 8% of men and 0.5% of women have some form of color vision deficiency (often called color blindness). The most common types are red-green deficiencies (deuteranopia, protanopia). These users may not be able to distinguish between colors that appear obviously different to people with typical color vision. Contrast ratio requirements apply regardless of which colors are used, ensuring content is accessible even to users with severely reduced contrast sensitivity.