#FFF1B8
#F5D67A
#8A7F63
#3B3A36
#92433EChestnut
#2F4C3AEvergreen
#EFE7D6Eggshell
#C5B27BSand
Classic Chestnut & Sand is a complementary color palette tagged warm, brown, beige. Chestnut and Sand sit nearly opposite on the color wheel, so the pairing has real energy; keep one as the accent. Neither washed out nor loud, it adapts to most contexts. The overall temperature is warm.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Chestnut | #92433E | rgb(146, 67, 62) | hsl(4, 40%, 41%) | oklch(48.4% 0.108 26) | |
| Evergreen | #2F4C3A | rgb(47, 76, 58) | hsl(143, 24%, 24%) | oklch(38.8% 0.047 156) | |
| Eggshell | #EFE7D6 | rgb(239, 231, 214) | hsl(41, 44%, 89%) | oklch(93.0% 0.024 86) | |
| Sand | #C5B27B | rgb(197, 178, 123) | hsl(45, 39%, 63%) | oklch(76.7% 0.076 91) |
Why it works and how to use it
It works because the lightness range is wide (24% to 89%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Eggshell (#EFE7D6) is the lightest color, so it belongs on large surfaces.
- Text: Evergreen (#2F4C3A) on #EFE7D6 gives 7.7:1, passing WCAG AAA.
- Primary: Chestnut (#92433E) is the most saturated mid-tone; use it for buttons and links (5.52:1 against the background, fine for UI elements).
- Accent: Sand (#C5B27B) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Evergreen on Eggshell at 7.7:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Classic Chestnut & Sand
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#92433E
#2F4C3A
#EFE7D6
#C5B27B
Color-blind check: under protanopia, Chestnut and Evergreen become hard to tell apart, so do not rely on that pair alone to carry meaning.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#2F4C3A on #EFE7D6 | Aa | 7.7:1 | AAA |
#92433E on #EFE7D6 | Aa | 5.52:1 | AA |
#2F4C3A on #C5B27B | Aa | 4.53:1 | AA |
#92433E on #C5B27B | Aa | 3.24:1 | AA large only |
#EFE7D6 on #C5B27B | Aa | 1.7:1 | Fail |
#92433E on #2F4C3A | Aa | 1.4:1 | Fail |
Similar palettes 24 more in this mood
#9A3B3B
#C08261
#E2C799
#F2ECBE
#B08968
#DDB892
#E6CCB2
#FFF6EA
#432818
#99582A
#BB9457
#FFE6A7
#6F1D1B
#BB9457
#99582A
#FFE6A7
#8D5524
#C68642
#E0AC69
#F1C27D
#2C1810
#6E4E3F
#B85C38
#E0C097
#4A0E0E
#9C3F3C
#C85956
#E8D8C4
#7A4A2E
#B06A3B
#E7A977
#F9E4D0
#C1440E
#E07A5F
#F2CC8F
#F4F1DE
#A68A64
#C2B280
#E6DCC3
#FAF7F0
#C9A66B
#E4C590
#F1E3C8
#F9F5EC
#A44A3F
#D4A373
#DCE3A8
#FBE6C2
#FFF3EC
#FFD3BF
#FFB39B
#6E5147
#804300
#9C0E59
#C23B00
#FFA9AC
#B5623A
#D9A57C
#A3B18A
#F3EDE4
#9C4A2F
#C97D5A
#E8C9A8
#F8F1E7
#8A4A3C
#C98C7A
#E9C7B0
#F6EFE8
#A0431F
#D07A4C
#F1DCC2
#FBF6EF
#FFD9A8
#CA8800
#9A6200
#4A2A00
#5B3F2E
#8B6A4E
#D9C2A0
#F6EFE3
#C4A484
#E6D3B3
#A98467
#F7F1E8
#D98C6B
#EFC1A2
#B5A78F
#F8F2EA
#CBAD73
#B59453
#9C7A3E
#80612F