Neutral Beige Color Palette
Warm ivory, beige and taupe down to a soft charcoal. A neutral beige palette is the quiet backdrop behind most calm, minimal interiors.
Click any color to copy its HEX code.
Neutral Beige color codes
| Name | HEX | RGB | HSL | |
|---|---|---|---|---|
| Ivory | #F7F3EC | 247, 243, 236 | 38°, 41%, 95% | |
| Cream | #EDE3D3 | 237, 227, 211 | 37°, 42%, 88% | |
| Beige | #D9C7AE | 217, 199, 174 | 35°, 36%, 77% | |
| Taupe | #A89580 | 168, 149, 128 | 32°, 19%, 58% | |
| Mushroom | #7E6E60 | 126, 110, 96 | 28°, 14%, 44% | |
| Charcoal | #3F3A36 | 63, 58, 54 | 27°, 8%, 23% |
How to use this palette
A simple way to use 6 colors without chaos is the 60-30-10 rule: about 60% of the space in the lightest shade, 30% in a supporting color and 10% in the accent. For this palette that is Ivory (#F7F3EC) as the base, Cream (#EDE3D3) as the supporting color and Beige (#D9C7AE) as the accent, with Charcoal (#3F3A36) for text and fine details.
Neutral Beige
A quick preview of the palette with base, text and accent colors.
Beige CreamWhere it works
Readable text color pairs
These combinations reach a contrast ratio of at least 4.5:1, the WCAG AA level for normal text, so they are safe for text on websites, posters and invitations.
- Charcoal on Ivory#3F3A36 on #F7F3EC · 10.2:1
- Charcoal on Cream#3F3A36 on #EDE3D3 · 8.8:1
- Charcoal on Beige#3F3A36 on #D9C7AE · 6.8:1
CSS variables
:root {
--ivory: #F7F3EC;
--cream: #EDE3D3;
--beige: #D9C7AE;
--taupe: #A89580;
--mushroom: #7E6E60;
--charcoal: #3F3A36;
}