Clay#8C5E3C
Dark Khaki#C19A6B
Pearl#EED6C4
Linen#FFF1E6
Dark Sienna#5A3E2B
Color Palette
#8C5E3C · #C19A6B · #EED6C4 · #FFF1E6 · #5A3E2B
monochromatic0 likes
Share
Export for Developers
:root {
--color-1: #8C5E3C;
--color-1-rgb: 140, 94, 60;
--color-1-hsl: 26, 40%, 39%;
--color-2: #C19A6B;
--color-2-rgb: 193, 154, 107;
--color-2-hsl: 33, 41%, 59%;
--color-3: #EED6C4;
--color-3-rgb: 238, 214, 196;
--color-3-hsl: 26, 55%, 85%;
--color-4: #FFF1E6;
--color-4-rgb: 255, 241, 230;
--color-4-hsl: 26, 100%, 95%;
--color-5: #5A3E2B;
--color-5-rgb: 90, 62, 43;
--color-5-hsl: 24, 35%, 26%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#8C5E3C
On White
5.55:1AA
On Black
3.78:1Fail
Aa
Aa
#C19A6B
On White
2.59:1Fail
On Black
8.1:1AAA
Aa
Aa
#EED6C4
On White
1.4:1Fail
On Black
15.05:1AAA
Aa
Aa
#FFF1E6
On White
1.11:1Fail
On Black
18.98:1AAA
Aa
Aa
#5A3E2B
On White
9.73:1AAA
On Black
2.16: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
#B69277
#DACBB9
#F8F1ED
#FEF1E7
#936F58
🌑
darker
· Reduced lightness, increased saturation
#462E1B
#916836
#DB9F70
#FFB780
#150E09
🌫️
muted
· Desaturated for a calm, muted look
#6D625A
#A2988B
#E2D7CF
#FBF1E9
#46423F
⚡
vibrant
· Boosted saturation for maximum impact
#AD5C1F
#E19E4C
#F08D42
#FF8B33
#A85924