Midnight Blue#172554
Sapphire#1D4ED8
Cornflower Blue#60A5FA
Periwinkle#BFDBFE
Alice Blue#EFF6FF

Color Palette

#172554 · #1D4ED8 · #60A5FA · #BFDBFE · #EFF6FF

monochromatic0 likes
Share

Export for Developers

:root {
  --color-1: #172554;
  --color-1-rgb: 23, 37, 84;
  --color-1-hsl: 226, 57%, 21%;
  --color-2: #1D4ED8;
  --color-2-rgb: 29, 78, 216;
  --color-2-hsl: 224, 76%, 48%;
  --color-3: #60A5FA;
  --color-3-rgb: 96, 165, 250;
  --color-3-hsl: 213, 94%, 68%;
  --color-4: #BFDBFE;
  --color-4-rgb: 191, 219, 254;
  --color-4-hsl: 213, 97%, 87%;
  --color-5: #EFF6FF;
  --color-5-rgb: 239, 246, 255;
  --color-5-hsl: 214, 100%, 97%;
}

Real World Preview

Get Started

Accessibility

WCAG Accessibility Report

Excellent
#172554
On White
14.69:1AAA
On Black
1.43:1Fail
Aa
Aa
#1D4ED8
On White
6.7:1AA
On Black
3.13:1Fail
Aa
Aa
#60A5FA
On White
2.54:1Fail
On Black
8.26:1AAA
Aa
Aa
#BFDBFE
On White
1.42:1Fail
On Black
14.78:1AAA
Aa
Aa
#EFF6FF
On White
1.09:1Fail
On Black
19.3:1AAA
Aa
Aa

Contrast ratios calculated per WCAG 2.1. AA requires ≥4.5:1, AAA requires ≥7:1 for normal text.

Palette Variations

Palette Variations

Original

☀️

lighter

· Increased lightness, reduced saturation

🌑

darker

· Reduced lightness, increased saturation

🌫️

muted

· Desaturated for a calm, muted look

vibrant

· Boosted saturation for maximum impact