Contrast checker
Check the contrast between two colors.
Calculate the contrast between a text color and a background color. The tool shows the ratio, AA and AAA results, and a visual preview to quickly check readability.
Colors
Text
Background
Result
| Check | Threshold | Status |
|---|---|---|
| AA normal text | 4.5:1 | Pass |
| AA large text | 3:1 | Pass |
| AAA normal text | 7:1 | Pass |
| AAA large text | 4.5:1 | Pass |
| UI and graphics | 3:1 | Pass |
Live preview
Quick explanation
Choose a text color and a background color. The contrast ratio updates automatically with the main WCAG thresholds for normal text, large text and interface elements.
Try this too
Need to analyze your website visits?
Use the Apache log analyzer to identify visitors, bots, HTTP errors and the most requested pages.
Additional information
Check contrast before publishing
This checker helps verify the readability of text on a given background. It is useful when preparing an interface, checking a visual identity, testing a button, adjusting a theme or understanding why an accessibility audit reports insufficient contrast.
The displayed ratio compares the relative luminance of both colors. The higher the ratio, the stronger the difference between text and background.
AA and AAA references
For normal text, AA generally requires a ratio of at least 4.5:1. For large text or important interface elements, the common reference is 3:1. AAA is stricter: 7:1 for normal text and 4.5:1 for large text.
These thresholds do not replace a full page review, but they provide a reliable reference to avoid weak contrast on essential content.
Test real interface states
Remember to check normal colors, hover states, active states, disabled buttons, error messages, badges and links. Good contrast on a primary button does not guarantee that every small text on the page is readable.
The preview helps you immediately see the rendering on different text sizes. It is still best to test the result in the real page, with the final font and size.
Limits and reuse
AppErgo tools are provided free of charge for practical and informational purposes. Although care is taken in their design, a result may be incomplete, unexpected or incorrect. Before relying on a result for any important use, check it using an appropriate method.
To report a bug in the tool, you can use the dedicated bug report form.
Results produced by AppErgo tools may be copied and reused freely. When publicly reusing a result, a method or an AppErgo page, a link to the relevant page is appreciated.
Unless otherwise stated, AppErgo texts, images, visual elements, scripts, templates and internal components remain the property of AppErgo.
For any other request, you can contact the webmaster.