Black#050505
Cyan#00FFFF
Dark Turquoise#00CCCC
Teal#006666
Black#001111
Color Palette
#050505 · #00FFFF · #00CCCC · #006666 · #001111
monochromatic0 likes
Share
Export for Developers
:root {
--color-1: #050505;
--color-1-rgb: 5, 5, 5;
--color-1-hsl: 0, 0%, 2%;
--color-2: #00FFFF;
--color-2-rgb: 0, 255, 255;
--color-2-hsl: 180, 100%, 50%;
--color-3: #00CCCC;
--color-3-rgb: 0, 204, 204;
--color-3-hsl: 180, 100%, 40%;
--color-4: #006666;
--color-4-rgb: 0, 102, 102;
--color-4-hsl: 180, 100%, 20%;
--color-5: #001111;
--color-5-rgb: 0, 17, 17;
--color-5-hsl: 180, 100%, 3%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#050505
On White
20.38:1AAA
On Black
1.03:1Fail
Aa
Aa
#00FFFF
On White
1.25:1Fail
On Black
16.75:1AAA
Aa
Aa
#00CCCC
On White
2:1Fail
On Black
10.51:1AAA
Aa
Aa
#006666
On White
6.79:1AA
On Black
3.09:1Fail
Aa
Aa
#001111
On White
19.3:1AAA
On Black
1.09:1Fail
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
#383838
#6EF7F7
#3DF5F5
#0AC2C2
#066F6F
🌑
darker
· Reduced lightness, increased saturation
#0D0C0C
#009999
#006666
#001919
#001919
🌫️
muted
· Desaturated for a calm, muted look
#050505
#26D9D9
#1FADAD
#0F5757
#020D0D
⚡
vibrant
· Boosted saturation for maximum impact
#854747
#00FFFF
#00CCCC
#00CCCC
#00CCCC