Graphite#5D4037
Walnut#795548
Stone#A1887F
Light Gray#D7CCC8
Linen#EFEBE9
Color Palette
#5D4037 · #795548 · #A1887F · #D7CCC8 · #EFEBE9
monochromatic0 likes
Share
Export for Developers
:root {
--color-1: #5D4037;
--color-1-rgb: 93, 64, 55;
--color-1-hsl: 14, 26%, 29%;
--color-2: #795548;
--color-2-rgb: 121, 85, 72;
--color-2-hsl: 16, 25%, 38%;
--color-3: #A1887F;
--color-3-rgb: 161, 136, 127;
--color-3-hsl: 16, 15%, 56%;
--color-4: #D7CCC8;
--color-4-rgb: 215, 204, 200;
--color-4-hsl: 16, 16%, 81%;
--color-5: #EFEBE9;
--color-5-rgb: 239, 235, 233;
--color-5-hsl: 20, 16%, 93%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#5D4037
On White
9.32:1AAA
On Black
2.25:1Fail
Aa
Aa
#795548
On White
6.55:1AA
On Black
3.21:1Fail
Aa
Aa
#A1887F
On White
3.31:1Fail
On Black
6.34:1AA
Aa
Aa
#D7CCC8
On White
1.57:1Fail
On Black
13.36:1AAA
Aa
Aa
#EFEBE9
On White
1.18:1Fail
On Black
17.73: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
#917269
#A48C84
#C5C0BF
#F3F2F1
#F3F2F1
🌑
darker
· Reduced lightness, increased saturation
#1E1310
#3C2720
#6E5349
#B09287
#C9B5AC
🌫️
muted
· Desaturated for a calm, muted look
#4A4A4A
#616161
#8F8F8F
#CFCFCF
#EDEDED
⚡
vibrant
· Boosted saturation for maximum impact
#9F482D
#9E4C2E
#C1775C
#C8836A
#C8896A