Accessible sample
16.20:1 contrast
#0D1B2A on #F5F7FA
PALETTE ACCESSIBILITY
Check every contrast pair in a palette
Paste 2–12 colors to find combinations that work for normal text, large text, and meaningful UI boundaries.
#0D1B2A#415A77#778DA9#F5F7FA#FF6B6B
WCAG contrast matrix
AA normal text requires 4.5:1. Large text and many meaningful component boundaries require 3:1.
8/20 AA pairs
| Text ↓ / Background → | 0D1B2A | 415A77 | 778DA9 | F5F7FA | FF6B6B |
|---|---|---|---|---|---|
| #0D1B2A | 1.00 | 2.44 | 5.10 | 16.20 | 6.26 |
| #415A77 | 2.44 | 1.00 | 2.08 | 6.62 | 2.56 |
| #778DA9 | 5.10 | 2.08 | 1.00 | 3.17 | 1.22 |
| #F5F7FA | 16.20 | 6.62 | 3.17 | 1.00 | 2.58 |
| #FF6B6B | 6.26 | 2.56 | 1.22 | 2.58 | 1.00 |
Accessible sample
16.20:1 contrast
#F5F7FA on #0D1B2A
Accessible sample
6.62:1 contrast
#415A77 on #F5F7FA
Accessible sample
6.62:1 contrast
#F5F7FA on #415A77
Accessible sample
6.26:1 contrast
#0D1B2A on #FF6B6B
Accessible sample
6.26:1 contrast
#FF6B6B on #0D1B2A
Minimal accessible adjustments
These suggestions preserve hue and chroma where possible while changing perceptual lightness until the pair reaches 4.5:1.
Replace #0D1B2A
#C0D2E7
on #415A77 · 4.60:1
Replace #415A77
#6B86A5
on #0D1B2A · 4.62:1
Replace #415A77
#0E253E
on #778DA9 · 4.55:1
Replace #415A77
#1D344F
on #FF6B6B · 4.56:1
Replace #778DA9
#BAD2F0
on #415A77 · 4.59:1
Replace #778DA9
#5D728D
on #F5F7FA · 4.59:1