Accessible Color Combinations: 12 High-Contrast Pairings for Modern UI

Tested and verified WCAG Level AA and AAA accessible text-and-background combinations with exact contrast ratios and design context recommendations.

Color Pickers Editorial TeamReviewed for Technical Accuracy

All 12 color combinations below achieve a contrast ratio above 4.5:1 (WCAG AA) and most exceed 7.0:1 (WCAG AAA) for standard body text.

#0F172A on #FFFFFF

Slate Obsidian on Pure White

Contrast: 18.2:1 (AAA Pass)

#F8FAFC on #0F172A

Ghost White on Dark Slate

Contrast: 17.1:1 (AAA Pass)

#FFFFFF on #1E40AF

Pure White on Deep Blue

Contrast: 8.4:1 (AAA Pass)

#FFFFFF on #064E3B

Pure White on Forest Emerald

Contrast: 9.8:1 (AAA Pass)

Try Related Color Tools

Convert any color between HEX, RGB, HSL, HSV, and CMYK.

Test your text and background for WCAG AA/AAA compliance.

Generate aesthetic 5-color harmony palettes.

Calculate 10-step monochromatic shade scales.