ع

Eco Brand

Natural greens that signal sustainability.

≈ Bottle Green
≈ Sea Green
≈ Seafoam Green
≈ Honeydew
≈ Dark Mode Gray

Color codes

HEXRGBHSLCMYK
hsl(153, 40%, 30%)cmyk(58%, 0%, 25%, 58%)
hsl(153, 39%, 41%)cmyk(56%, 0%, 26%, 43%)
hsl(147, 43%, 71%)cmyk(30%, 0%, 16%, 16%)
hsl(129, 53%, 90%)cmyk(11%, 0%, 9%, 5%)
hsl(159, 56%, 7%)cmyk(71%, 0%, 25%, 89%)

CSS

:root {
  --eco-brand-1: #2D6A4F;
  --eco-brand-2: #40916C;
  --eco-brand-3: #95D5B2;
  --eco-brand-4: #D8F3DC;
  --eco-brand-5: #081C15;
}

How these colors work together

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

4 of 10 color pairs reach the 4.5:1 contrast needed for normal text. The most readable pair is ⁦#D8F3DC⁩ on ⁦#081C15⁩ (14.97:1).

Eco Brand — readable text using the best pair.

Suggested applications

  • Logos and complete visual identities.
  • Interface themes: use the lightest color for backgrounds and the darkest for text.
  • Brand kits, social graphics and presentations.

#eco#green#sustainable

Check accessibility Simulate color blindness CSS variables

Frequently asked questions

How do I use the Eco Brand palette?
The Eco Brand 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 ⁦#D8F3DC⁩ on ⁦#081C15⁩: it has a contrast ratio of 14.97: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

Bold Food Brand#D62828 #F77F00 #FCBF49 #EAE2B7 #003049Calm Wellness#F6F1EB #E3D5CA #A3B18A #588157 #344E41Fresh Startup#06D6A0 #118AB2 #073B4C #FFD166 #EF476FTropical Leaves#004B23 #007200 #38B000 #9EF01A #FFBE0BCitrus Splash#F9C80E #F86624 #EA3546 #662E9B #43BCCDFaded Postcard#D8C3A5 #E98074 #8E8D8A #E85A4F #EAE7DC