Onyx#2B2D42
Dodger Blue#3A86FF
Cornflower Blue#4895EF
Baby Blue#90DBF4
Alice Blue#F1FAFF
Color Palette
#2B2D42 · #3A86FF · #4895EF · #90DBF4 · #F1FAFF
analogous0 likes
Share
Export for Developers
:root {
--color-1: #2B2D42;
--color-1-rgb: 43, 45, 66;
--color-1-hsl: 235, 21%, 21%;
--color-2: #3A86FF;
--color-2-rgb: 58, 134, 255;
--color-2-hsl: 217, 100%, 61%;
--color-3: #4895EF;
--color-3-rgb: 72, 149, 239;
--color-3-hsl: 212, 84%, 61%;
--color-4: #90DBF4;
--color-4-rgb: 144, 219, 244;
--color-4-hsl: 195, 82%, 76%;
--color-5: #F1FAFF;
--color-5-rgb: 241, 250, 255;
--color-5-hsl: 201, 100%, 97%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#2B2D42
On White
13.49:1AAA
On Black
1.56:1Fail
Aa
Aa
#3A86FF
On White
3.48:1Fail
On Black
6.03:1AA
Aa
Aa
#4895EF
On White
3.08:1Fail
On Black
6.82:1AA
Aa
Aa
#90DBF4
On White
1.54:1Fail
On Black
13.62:1AAA
Aa
Aa
#F1FAFF
On White
1.06:1Fail
On Black
19.86: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
#5D5F74
#A3C4FA
#ABCCF2
#E9F7FB
#E7F6FE
🌑
darker
· Reduced lightness, increased saturation
#090A10
#0050D1
#0C62C6
#2DC0F0
#8AD6FF
🌫️
muted
· Desaturated for a calm, muted look
#363636
#568BE1
#6698D1
#A2D2E2
#F2F9FD
⚡
vibrant
· Boosted saturation for maximum impact
#323B9A
#3381FF
#3392FF
#33CCFF
#33B8FF