Color code and palette
Beige Color
Beige is a light warm neutral with the CSS value #F5F5DC. It offers more warmth than white while preserving enough quiet space for editorial, hospitality and natural product layouts.
Beige
#F5F5DC
Color formats
The same base color in common web formats.
Shades
| Color | Name | HEX | RGB | HSL | Copy |
|---|---|---|---|---|---|
| Beige 50 | #F9F9EB | 249, 249, 235 | 60, 54%, 95% | ||
| Beige 100 | #EEEEC3 | 238, 238, 195 | 60, 56%, 85% | ||
| Beige 200 | #E3E39C | 227, 227, 156 | 60, 56%, 75% | ||
| Beige 300 | #D8D874 | 216, 216, 116 | 60, 56%, 65% | ||
| Beige 400 | #CDCD4C | 205, 205, 76 | 60, 56%, 55% | ||
| Beige 500 | #B3B332 | 179, 179, 50 | 60, 56%, 45% | ||
| Beige 600 | #8B8B27 | 139, 139, 39 | 60, 56%, 35% | ||
| Beige 700 | #63631C | 99, 99, 28 | 60, 56%, 25% | ||
| Beige 800 | #3C3C11 | 60, 60, 17 | 60, 56%, 15% | ||
| Beige 900 | #141406 | 20, 20, 6 | 60, 54%, 5% |
Text contrast
These ratios use the WCAG relative luminance formula.
Aa White text 1.11:1
Fail
Aa Black text 18.98:1
AAA
Ways to use Beige
Warm editorial backgrounds
Hospitality and lifestyle brands
Natural palettes with olive or brown
Colors that go with Beige
Color-wheel harmonies built from #F5F5DC. Click a swatch to copy it or open the set in the color wheel.
Split complementary
Open in color wheelA base plus the two neighbors of its complement — contrast with less tension.