Palette

Rainforest Mist Canopy

Drenched in the rich, vibrant greens of a humid rainforest shrouded in morning mist.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0F3D3C#1A535C#4ECDC4#FFEA00#CBDAAD

Palette guide

How to use Rainforest Mist Canopy

Overview

The "Rainforest Mist Canopy" palette combines deep, mysterious greens and blues with a striking pop of yellow and a soft, misty accent, evoking the serene yet vibrant atmosphere of a humid rainforest. From the profound #0F3D3C to the bright #FFEA00 and tranquil #CBDAAD, this palette offers a unique blend of earthy calm and energetic contrast. The versatile #1A535C and #4ECDC4 provide harmonious mid-tones. It's ideal for designers seeking to create a sophisticated, natural, and slightly ethereal aesthetic, perfect for conveying depth, mystery, and a touch of unexpected brightness in digital and print designs.

Best used for

Spa and wellness retreats
Mysterious adventure game interfaces
Nature photography showcases
Eco-conscious luxury brands
Environmental documentary branding
Artistic and abstract web design

Suggested color roles

primary

Use #0F3D3C as a deep, grounding base for brand identity, main headers, and strong calls-to-action.

secondary

Apply #1A535C as a supporting color for navigation, subheadings, and content separation, adding depth.

accent

Utilize #FFEA00 as a bold, unexpected pop of yellow for critical highlights, interactive elements, or alerts.

background

Employ #CBDAAD as a soft, misty green-gray for a calming and airy backdrop, enhancing content readability.

text

On dark backgrounds like #0F3D3C, white text ensures readability. For light backgrounds, #0F3D3C or dark charcoal works best.

Accessibility notes

#FFEA00 (yellow) will require very dark text (e.g., black) for readability due to its high luminance and low contrast with white.
Ensure #4ECDC4 provides sufficient contrast for text on backgrounds like #CBDAAD to meet WCAG AA standards.
The dark colors #0F3D3C and #1A535C offer excellent contrast for light text, suitable for headers or dark mode.
Always test all color combinations for WCAG AA compliance, especially for interactive elements and important text.

Recommended combinations

Misty Depths

Deep, dark base with a soft, misty background and a bright, cool accent for a serene yet intriguing feel.

#0F3D3C · #CBDAAD · #4ECDC4

Sunlit Glade

Dark blue-green with a striking yellow accent, anchored by the deepest shade for powerful contrast.

#1A535C · #FFEA00 · #0F3D3C

Ethereal Contrast

Bright, cool teal with a soft background and a deep, grounding element for an ethereal design.

#4ECDC4 · #CBDAAD · #0F3D3C

CSS variables

:root {
  --rainforest-mist-canopy-1: #0F3D3C;
  --rainforest-mist-canopy-2: #1A535C;
  --rainforest-mist-canopy-3: #4ECDC4;
  --rainforest-mist-canopy-4: #FFEA00;
  --rainforest-mist-canopy-5: #CBDAAD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rainforest-mist-canopy": {
        1: "#0F3D3C",
        2: "#1A535C",
        3: "#4ECDC4",
        4: "#FFEA00",
        5: "#CBDAAD",
      }
    }
  }
}

Hex values

Color 1#0F3D3C

Color 2#1A535C

Color 3#4ECDC4

Color 4#FFEA00

Color 5#CBDAAD

Accessibility

Contrast checker

1.4:1Fail

6.2:1AA

9.7:1AAA

8.1:1AAA

1.4:1Fail

4.5:1AA18

7:1AA

5.8:1AA

6.2:1AA

4.5:1AA18

1.6:1Fail

1.3:1Fail

9.7:1AAA

7:1AA

1.6:1Fail

1.2:1Fail

8.1:1AAA

5.8:1AA

1.3:1Fail

1.2:1Fail

Similar palettes

More like Rainforest Mist Canopy

View all earth

Tropical Rainforest Floor

Emerald Canopy Mist

Emerald Canopy Shroud

Emerald Moss Canopy

Enchanted Forest Canopy

Jungle Canopy Emerald