ع

Olive Grove

Olive leaves, dry grass and dark soil.

≈ Army Green
≈ Olive Drab
≈ Sage
≈ Pearl
≈ Coffee

Color codes

HEXRGBHSLCMYK
hsl(77, 44%, 25%)cmyk(18%, 0%, 61%, 65%)
hsl(73, 41%, 39%)cmyk(12%, 0%, 58%, 45%)
hsl(62, 29%, 60%)cmyk(1%, 0%, 32%, 28%)
hsl(53, 41%, 83%)cmyk(0%, 2%, 15%, 10%)
hsl(19, 29%, 28%)cmyk(0%, 30%, 45%, 64%)

CSS

:root {
  --olive-grove-1: #4A5A23;
  --olive-grove-2: #7A8B3A;
  --olive-grove-3: #B5B77C;
  --olive-grove-4: #E6E2C3;
  --olive-grove-5: #5C4033;
}

How these colors work together

The colors are analogous — neighbors on the color wheel — which gives a calm, cohesive feel. Overall it reads warm. Lightness spans 59 points, which sets how much contrast you can create.

2 of 10 color pairs reach the 4.5:1 contrast needed for normal text. The most readable pair is ⁦#E6E2C3⁩ on ⁦#5C4033⁩ (7.17:1).

Olive Grove — readable text using the best pair.

Suggested applications

  • Outdoor brands, wellness and sustainability projects.
  • Interface themes: use the lightest color for backgrounds and the darkest for text.
  • Brand kits, social graphics and presentations.

#olive#mediterranean#earth

Check accessibility Simulate color blindness CSS variables

Frequently asked questions

How do I use the Olive Grove palette?
The Olive Grove palette has 5 colors. Use one dominant color for large areas, a supporting color for secondary elements and the most saturated color sparingly as an accent.
Which colors in this palette are best for text?
Use ⁦#E6E2C3⁩ on ⁦#5C4033⁩: it has a contrast ratio of 7.17:1.
Can I download this palette?
Yes. Export it as PNG, SVG, CSS variables, JSON or plain text with the buttons above the color table.

More palettes

Desert Dunes#F2D6B3 #E0A96D #C2763B #8C4A2F #3B2A20Forest Floor#1B3A2B #3E6B48 #7FA16B #C9B88A #6B4F3AOcean Depths#03045E #0077B6 #00B4D8 #90E0EF #CAF0F8Cotton Candy#FFC8DD #FFAFCC #BDE0FE #A2D2FF #CDB4DBPaper and Ink#FAFAF7 #E8E6E1 #9A968E #3A3935 #111111Calm Wellness#F6F1EB #E3D5CA #A3B18A #588157 #344E41