20
Total shades
in database
0
Pass AA on white
0% of shades
0
Pass AAA on white
0% of shades
20
Pass AA on black
100% of shades
WCAG AA Score
Shades passing 4.5:1 on white
0 of 20 White shades achieve at least 4.5:1 contrast on white — the WCAG AA threshold for normal body text.
WCAG AAA Score
Shades passing 7:1 on white
0 of 20 White shades exceed 7:1 — the WCAG AAA threshold required for enhanced accessibility.
Recommended Text Colors
When using a White shade as a background, use these text colors for WCAG AA compliance.
Dark text works on:
Recommended Backgrounds
When using a White shade as text color, these backgrounds provide WCAG AA compliance.
Automated Accessibility Validation — All White Shades
| Color | Hex | On White | On Black | Best Use |
|---|---|---|---|---|
| White | #FFFFFF | WCAG Fail1.0:1 | WCAG AAA21.0:1 | Text on black |
| Ivory White | #FFFFF0 | WCAG Fail1.0:1 | WCAG AAA20.8:1 | Text on black |
| Mint Cream | #F5FFFA | WCAG Fail1.0:1 | WCAG AAA20.6:1 | Text on black |
| Azure White | #F0FFFF | WCAG Fail1.0:1 | WCAG AAA20.4:1 | Text on black |
| Snow White | #FFFAFA | WCAG Fail1.0:1 | WCAG AAA20.3:1 | Text on black |
| Honeydew | #F0FFF0 | WCAG Fail1.0:1 | WCAG AAA20.3:1 | Text on black |
| Cream White | #FFFDD0 | WCAG Fail1.0:1 | WCAG AAA20.2:1 | Text on black |
| Floral White | #FFFAF0 | WCAG Fail1.0:1 | WCAG AAA20.2:1 | Text on black |
| Off White | #FAF9F6 | WCAG Fail1.1:1 | WCAG AAA19.9:1 | Text on black |
| Ghost White | #F8F8FF | WCAG Fail1.1:1 | WCAG AAA19.9:1 | Text on black |
| Cosmic Latte | #FFF8E7 | WCAG Fail1.1:1 | WCAG AAA19.8:1 | Text on black |
| Seashell | #FFF5EE | WCAG Fail1.1:1 | WCAG AAA19.6:1 | Text on black |
| Old Lace | #FDF5E6 | WCAG Fail1.1:1 | WCAG AAA19.4:1 | Text on black |
| Magnolia | #F8F4FF | WCAG Fail1.1:1 | WCAG AAA19.4:1 | Text on black |
| Lavender Blush | #FFF0F5 | WCAG Fail1.1:1 | WCAG AAA19.0:1 | Text on black |
| Linen | #FAF0E6 | WCAG Fail1.1:1 | WCAG AAA18.7:1 | Text on black |
| Alabaster | #F2F0EB | WCAG Fail1.1:1 | WCAG AAA18.4:1 | Text on black |
| Eggnog | #FBEEC1 | WCAG Fail1.2:1 | WCAG AAA18.1:1 | Text on black |
| Antique White | #FAEBD7 | WCAG Fail1.2:1 | WCAG AAA17.9:1 | Text on black |
| Pearl White | #F0EAD6 | WCAG Fail1.2:1 | WCAG AAA17.4:1 | Text on black |
Accessibility Notes
- 1
White on black achieves 21:1 contrast — WCAG AAA. White text is safe on any background with luminance below ~0.18.
- 2
White text on mid-tone backgrounds (gray 400–600, blue 400–600) typically fails WCAG AA — always check.
- 3
White on medium-bright colors (yellow, cyan, lime) often fails — these colors are too luminous for white text.
- 4
In dark-mode UIs, off-white (#F1F5F9, #F8FAFC) is gentler than pure white and still passes AAA on dark backgrounds.
- 5
WCAG recommends a minimum 3:1 contrast for large text and UI components; 4.5:1 for normal text. White typically only meets these on genuinely dark backgrounds.
Design Examples
CARD WITH WHITE BACKGROUND
Card heading
A card component using White as the background. Dark text ensures readability.
Design Tips
- ✓
White text passes WCAG AA on any background with a contrast ratio of 4.5:1+ — generally dark shades of any color.
- ✓
Use #F8FAFC (near-white) instead of pure white for backgrounds — slightly warmer and reduces glare.
- ✓
For dark buttons (navy, dark green, dark purple), white text is almost always accessible. Always verify with the specific shade.