Palette

Tropical Canopy Mist

Lush greens and cool misted tones evoke the vibrant and damp atmosphere of a tropical rainforest canopy.

earthcalm5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Tropical Canopy 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 Tropical Canopy Mist.

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

Data visualization

#0F3B2C#2A5A48#4D7D6A#7CA89A#A6CEC0

Palette guide

How to use Tropical Canopy Mist

Overview

The Tropical Canopy Mist palette offers a serene and sophisticated blend of lush greens, perfect for evoking tranquility and natural depth. This collection, featuring deep forest green #0F3B2C, a balanced mid-tone #4D7D6A, and the airy #A6CEC0, is ideal for projects requiring a calming yet rich aesthetic. Designers and developers will find these hues versatile for creating immersive digital experiences or tangible products that resonate with themes of nature, sustainability, and peaceful reflection. The darker tones provide strong anchors, while lighter shades offer refreshing contrast and a sense of openness, mirroring the subtle light filtering through a dense rainforest canopy.

Best used for

Eco-friendly brand identity and packaging
Spa and wellness website design
Nature-inspired interior decor concepts
Environmental non-profit campaigns
Sustainable fashion lookbooks
Tranquil mobile app interfaces

Suggested color roles

primary

Use #0F3B2C as a deep, grounding primary color for headers, main navigation, or brand logos, conveying stability and natural elegance.

secondary

Employ #2A5A48 for supportive elements like subheadings, secondary buttons, or background sections, offering a slightly softer yet still robust green.

accent

Apply #A6CEC0 as a refreshing accent for highlights, hover states, or subtle graphic elements, providing a misty, ethereal touch.

background

Utilize #A6CEC0 for a light, breathable background, or #7CA89A for a slightly deeper, more immersive base that still feels open.

text

For optimal readability, use #0F3B2C for primary text on lighter backgrounds like #A6CEC0. Consider a dark charcoal or black for general body text on the lightest shades.

Accessibility notes

Ensure #0F3B2C provides excellent contrast against #A6CEC0 for all text sizes.
When pairing mid-tones like #4D7D6A with #7CA89A, check contrast for UI elements to maintain readability.
Avoid using #7CA89A as text on #A6CEC0; their similar lightness will result in insufficient contrast.
For critical information, always use the darkest shade, #0F3B2C, on the lightest available background, #A6CEC0.

Recommended combinations

Deep Mist

A classic high-contrast pairing for professional branding and clear content hierarchy.

#0F3B2C · #A6CEC0 · #2A5A48

Canopy Layers

Creates a soft, layered gradient feel with the darkest green for emphasis on text or icons.

#4D7D6A · #7CA89A · #0F3B2C

Misty Accent

Ideal for digital interfaces, using a mid-green base with light accents and a supportive mid-light tone.

#2A5A48 · #A6CEC0 · #7CA89A

CSS variables

:root {
  --tropical-canopy-mist-1: #0F3B2C;
  --tropical-canopy-mist-2: #2A5A48;
  --tropical-canopy-mist-3: #4D7D6A;
  --tropical-canopy-mist-4: #7CA89A;
  --tropical-canopy-mist-5: #A6CEC0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "tropical-canopy-mist": {
        1: "#0F3B2C",
        2: "#2A5A48",
        3: "#4D7D6A",
        4: "#7CA89A",
        5: "#A6CEC0",
      }
    }
  }
}

Hex values

Color 1#0F3B2C

Color 2#2A5A48

Color 3#4D7D6A

Color 4#7CA89A

Color 5#A6CEC0

Accessibility

Contrast checker

1.6:1Fail

2.6:1Fail

4.7:1AA

7.3:1AAA

1.6:1Fail

1.7:1Fail

3:1Fail

4.6:1AA

2.6:1Fail

1.7:1Fail

1.8:1Fail

2.7:1Fail

4.7:1AA

3:1Fail

1.8:1Fail

1.5:1Fail

7.3:1AAA

4.6:1AA

2.7:1Fail

1.5:1Fail

Similar palettes

More like Tropical Canopy Mist

View all earth

Emerald Canopy Dawn

Misty Forest Clearing

Verdant Moss Path

Whispering Forest Path

Woodland Mist Veil

Ancient Forest Hearth