Off White#FFFDF7
Antique White#F5E6D3
Apricot#E8C9A0
Dark Khaki#D4A96A
Dark Goldenrod#B8860B
Color Palette
#FFFDF7 · #F5E6D3 · #E8C9A0 · #D4A96A · #B8860B
analogous0 likes
Share
Export for Developers
:root {
--color-1: #FFFDF7;
--color-1-rgb: 255, 253, 247;
--color-1-hsl: 45, 100%, 98%;
--color-2: #F5E6D3;
--color-2-rgb: 245, 230, 211;
--color-2-hsl: 34, 63%, 89%;
--color-3: #E8C9A0;
--color-3-rgb: 232, 201, 160;
--color-3-hsl: 34, 61%, 77%;
--color-4: #D4A96A;
--color-4-rgb: 212, 169, 106;
--color-4-hsl: 36, 55%, 62%;
--color-5: #B8860B;
--color-5-rgb: 184, 134, 11;
--color-5-hsl: 43, 89%, 38%;
}Real World Preview
Get Started
Accessibility
WCAG Accessibility Report
Excellent#FFFDF7
On White
1.02:1Fail
On Black
20.65:1AAA
Aa
Aa
#F5E6D3
On White
1.23:1Fail
On Black
17.14:1AAA
Aa
Aa
#E8C9A0
On White
1.58:1Fail
On Black
13.29:1AAA
Aa
Aa
#D4A96A
On White
2.17:1Fail
On Black
9.68:1AAA
Aa
Aa
#B8860B
On White
3.25:1Fail
On Black
6.45:1AA
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
#FEF8E7
#F9F3EB
#F9F3EC
#E6D5BC
#E9B93F
🌑
darker
· Reduced lightness, increased saturation
#FFE38F
#E6B77A
#DA9B49
#AB782B
#594103
🌫️
muted
· Desaturated for a calm, muted look
#FDFCF6
#ECE4DA
#D7C7B2
#B6A386
#9A7A28
⚡
vibrant
· Boosted saturation for maximum impact
#FFCC33
#F8A63A
#F6A53C
#F0AA42
#CC9200