Charcoal#4A4E69
Stone#9A8C98
Tan#C9ADA7
Linen#F2E9E4
Jet#22223B
Color Palette
#4A4E69 · #9A8C98 · #C9ADA7 · #F2E9E4 · #22223B
monochromatic0 likes
Share
Export for Developers
:root {
--color-1: #4A4E69;
--color-1-rgb: 74, 78, 105;
--color-1-hsl: 232, 17%, 35%;
--color-2: #9A8C98;
--color-2-rgb: 154, 140, 152;
--color-2-hsl: 309, 6%, 58%;
--color-3: #C9ADA7;
--color-3-rgb: 201, 173, 167;
--color-3-hsl: 11, 24%, 72%;
--color-4: #F2E9E4;
--color-4-rgb: 242, 233, 228;
--color-4-hsl: 21, 35%, 92%;
--color-5: #22223B;
--color-5-rgb: 34, 34, 59;
--color-5-hsl: 240, 27%, 18%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#4A4E69
On White
8.12:1AAA
On Black
2.58:1Fail
Aa
Aa
#9A8C98
On White
3.19:1Fail
On Black
6.58:1AA
Aa
Aa
#C9ADA7
On White
2.1:1Fail
On Black
10.02:1AAA
Aa
Aa
#F2E9E4
On White
1.2:1Fail
On Black
17.55:1AAA
Aa
Aa
#22223B
On White
15.44:1AAA
On Black
1.36: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
#848694
#C7C7C7
#EDE9E8
#F5F1EF
#505071
🌑
darker
· Reduced lightness, increased saturation
#1E202F
#6C5668
#A86E61
#D4AF9B
#090911
🌫️
muted
· Desaturated for a calm, muted look
#595959
#949494
#B8B8B8
#ECEAEA
#2E2E2E
⚡
vibrant
· Boosted saturation for maximum impact
#364396
#BA6DAF
#D07662
#DB8557
#2C2CA0