Contrast Checker guide
How to Check Color Contrast for AA and AAA Text
Measure foreground and background contrast, compare normal and large text thresholds and understand alpha compositing without claiming a full accessibility audit.
Open Contrast Checker →Before you start
- Use a current browser with JavaScript enabled. Read the limits below before using private or large inputs.
Step-by-step instructions
- Enter the foreground text color and background color as HEX, RGB or HSL.
- Read the contrast ratio and the live text sample.
- Check normal-text AA and AAA indications separately.
- Check large-text indications only for text at least 18pt, or 14pt bold.
- Swap the colors or adjust them, then review contrast in the actual page context.
Interpret results and limitations
AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 and 4.5:1 respectively. Pass/fail uses the unrounded ratio, while the displayed value has two decimals.
Transparent foreground is composited over the background; a transparent background is composited over white. This checks two colors, not gradients, images, focus behavior or the accessibility of an entire website.
Example
Use this example to understand the expected behavior before working with your own input.
Black on white: 21:1
White on white: 1:1Troubleshooting
A ratio near the threshold seems inconsistent
The display is rounded to two decimals. The indication uses the full calculated ratio; choose a margin above the threshold.
The interface does not respond
Enable JavaScript, use a supported browser and check the input limits. Reloading clears temporary input and results.
Privacy and cleanup
Inputs and results stay in the current tab. Nothing is uploaded or stored in input history. Optional analytics receives fixed tool identifiers only; entered data, file names and generated values are excluded.
Read the Privacy Policy for site preferences, optional analytics and hosting information.
Related tools and guides
Use Contrast Checker with the steps above, or continue with a related task.
Technical references
These references explain the underlying formats or browser behavior. The steps above describe the current AnyUtils tool.