Back to palettes

Palette

Emerald Rainforest Mist

A refreshing blend of greens evoking the damp, vibrant life of a misty rainforest.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Rainforest Mist reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Emerald Rainforest Mist.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#1E4620#3E6C40#6C9A6E#9EC89E#CFE8CE

Palette guide

How to use Emerald Rainforest Mist

Overview

The Emerald Rainforest Mist palette offers a refreshing blend of greens, evoking the damp, vibrant life of a misty rainforest. From the profound depth of #1E4620 and #3E6C40, it transitions through the balanced #6C9A6E to the lighter, airy #9EC89E, culminating in the gentle #CFE8CE. This collection is perfect for designs seeking to convey tranquility, natural abundance, and a sense of serene growth. Ideal for eco-friendly brands, wellness applications, or any digital interface that benefits from a clean, harmonious, and soothing aesthetic. The monochromatic progression provides excellent visual flow and depth, creating an immersive user experience.

Best used for

  • Rainforest conservation initiatives
  • Organic and natural food branding
  • Meditation and nature sound apps
  • Sustainable fashion and textiles
  • Botanical garden websites
  • Eco-tourism brochures and websites

Suggested color roles

primary

Use #1E4620 as the deepest, most stable color for main headers, branding, or dark mode.

secondary

Employ #3E6C40 as a supportive deep green for subheadings, important text, or active states.

accent

Apply #6C9A6E as a refreshing, subtle accent for interactive elements or gentle highlights.

background

Utilize #CFE8CE as a very light, misty background for clean content areas, providing a calm and clear base.

text

Pair #1E4620 with light backgrounds for strong contrast, or use white/light gray on darker backgrounds.

Accessibility notes

  • #CFE8CE and #9EC89E require very dark text (e.g., #1E4620 or black) to ensure readability.
  • Pair #1E4620 or #3E6C40 with white or off-white text for optimal legibility on dark backgrounds.
  • Avoid using #6C9A6E directly on #9EC89E for small text due to potential low contrast.
  • Always verify WCAG AA contrast standards for all text and background combinations.

Recommended combinations

Rainforest Floor

Creates a strong, immersive foundation for primary branding or elegant dark mode interfaces.

#1E4620 · #3E6C40 · #6C9A6E

Misty Canopy

Ideal for clean, inviting layouts with light backgrounds and clear, readable text.

#CFE8CE · #9EC89E · #1E4620

Lush Growth

Suitable for interactive elements, progress indicators, or illustrating natural growth and vitality.

#6C9A6E · #9EC89E · #3E6C40

CSS variables

:root {
  --emerald-rainforest-mist-1: #1E4620;
  --emerald-rainforest-mist-2: #3E6C40;
  --emerald-rainforest-mist-3: #6C9A6E;
  --emerald-rainforest-mist-4: #9EC89E;
  --emerald-rainforest-mist-5: #CFE8CE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-rainforest-mist": {
        1: "#1E4620",
        2: "#3E6C40",
        3: "#6C9A6E",
        4: "#9EC89E",
        5: "#CFE8CE",
      }
    }
  }
}

Related searches

rainforest green palettemisty nature colorslush green brandingcalm earthy greenseco-friendly UI design

Palette colors

Hex values

Color 1#1E4620
·
Color 2#3E6C40
·
Color 3#6C9A6E
·
Color 4#9EC89E
·
Color 5#CFE8CE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
3.3:1AA18
5.7:1AA
8.2:1AAA
2
1.8:1Fail
1.9:1Fail
3.3:1AA18
4.7:1AA
3
3.3:1AA18
1.9:1Fail
1.7:1Fail
2.5:1Fail
4
5.7:1AA
3.3:1AA18
1.7:1Fail
1.4:1Fail
5
8.2:1AAA
4.7:1AA
2.5:1Fail
1.4:1Fail

Similar palettes

More like Emerald Rainforest Mist

View all earth
Lush Rainforest Floor
Canopy Emerald Burst
Emerald Canopy Shroud
Jungle Canopy
Rainforest Canopy Dew
Emerald Canopy Mist