#004E64
#00A5CF
#9FFFCB
#25A18E
#7AE582
Color Palette
#004E64 · #00A5CF · #9FFFCB · #25A18E · #7AE582
analogous2 likes
Export for Developers
:root {
--color-1: #004E64;
--color-1-rgb: 0, 78, 100;
--color-1-hsl: 193, 100%, 20%;
--color-2: #00A5CF;
--color-2-rgb: 0, 165, 207;
--color-2-hsl: 192, 100%, 41%;
--color-3: #9FFFCB;
--color-3-rgb: 159, 255, 203;
--color-3-hsl: 147, 100%, 81%;
--color-4: #25A18E;
--color-4-rgb: 37, 161, 142;
--color-4-hsl: 171, 63%, 39%;
--color-5: #7AE582;
--color-5-rgb: 122, 229, 130;
--color-5-hsl: 124, 67%, 69%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#004E64
On White
9.24:1AAA
On Black
2.27:1Fail
Aa
Aa
#00A5CF
On White
2.88:1Fail
On Black
7.28:1AAA
Aa
Aa
#9FFFCB
On White
1.19:1Fail
On Black
17.64:1AAA
Aa
Aa
#25A18E
On White
3.2:1Fail
On Black
6.57:1AA
Aa
Aa
#7AE582
On White
1.57:1Fail
On Black
13.36: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
#0A9AC2
#42D1F5
#E7FEF1
#5FCEBD
#D3F3D5
🌑
darker
· Reduced lightness, increased saturation
#001419
#00566B
#38FF92
#105148
#23D72F
🌫️
muted
· Desaturated for a calm, muted look
#0F4757
#1F94B2
#ADF0CB
#43847A
#93CD97
⚡
vibrant
· Boosted saturation for maximum impact
#00A0CC
#00A7D1
#33FF8F
#07C5A8
#36FC43