#A98467
#6C584C
#ADC178
#F0EAD2
#DDE5B6
Color Palette
#A98467 · #6C584C · #ADC178 · #F0EAD2 · #DDE5B6
analogous1 likes
Export for Developers
:root {
--color-1: #A98467;
--color-1-rgb: 169, 132, 103;
--color-1-hsl: 26, 28%, 53%;
--color-2: #6C584C;
--color-2-rgb: 108, 88, 76;
--color-2-hsl: 23, 17%, 36%;
--color-3: #ADC178;
--color-3-rgb: 173, 193, 120;
--color-3-hsl: 76, 37%, 61%;
--color-4: #F0EAD2;
--color-4-rgb: 240, 234, 210;
--color-4-hsl: 48, 50%, 88%;
--color-5: #DDE5B6;
--color-5-rgb: 221, 229, 182;
--color-5-hsl: 70, 47%, 81%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#A98467
On White
3.4:1Fail
On Black
6.18:1AA
Aa
Aa
#6C584C
On White
6.69:1AA
On Black
3.14:1Fail
Aa
Aa
#ADC178
On White
1.97:1Fail
On Black
10.68:1AAA
Aa
Aa
#F0EAD2
On White
1.21:1Fail
On Black
17.4:1AAA
Aa
Aa
#DDE5B6
On White
1.32:1Fail
On Black
15.96: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
#C7B8AE
#978D87
#D5DCC1
#F7F5ED
#F5F7EE
🌑
darker
· Reduced lightness, increased saturation
#705038
#322720
#7D943D
#DAC881
#BECF68
🌫️
muted
· Desaturated for a calm, muted look
#878787
#5C5C5C
#9FA395
#E7E4DA
#D4D7C6
⚡
vibrant
· Boosted saturation for maximum impact
#CD7E42
#965B36
#B9DD55
#EBCA47
#CDE84A