Back to palettes

Palette

Emerald Canopy Bloom

Rich, deep greens and teals of a vibrant jungle canopy, full of hidden life.

darknatural5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Canopy Bloom 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 Canopy Bloom.

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

Data visualization

#0F3D3D#2B6C6C#4D9A9A#82CACA#B6E6E6

Palette guide

How to use Emerald Canopy Bloom

Overview

The Emerald Canopy Bloom palette captures the rich, deep greens and teals of a vibrant jungle canopy, teeming with hidden life. Ranging from a very dark teal (#0F3D3D) to progressively lighter shades like dark teal (#2B6C6C), medium teal (#4D9A9A), and light teal (#82CACA), it culminates in a very light teal (#B6E6E6). This palette is perfect for designers and developers aiming to create a lush, mysterious, and sophisticated aesthetic. It evokes the feeling of abundant nature and hidden depths, making it ideal for projects that seek to convey richness, tranquility, and a touch of exotic allure, like a thriving rainforest.

Best used for

  • Luxury eco-tourism branding
  • Nature documentary websites or apps
  • High-end spa or wellness product packaging
  • Sophisticated interior design concepts
  • Digital art depicting lush, tropical environments
  • Brand identities for sustainable, premium goods

Suggested color roles

primary

Very dark teal (#0F3D3D) serves as a deep, mysterious primary, perfect for headers, navigation, or strong brand elements, providing a luxurious foundation.

secondary

Dark teal (#2B6C6C) acts as a lush secondary, ideal for subheadings, interactive components, or sections needing a rich, encompassing green.

accent

Light teal (#82CACA) offers a vibrant accent, perfect for highlights, small icons, or calls-to-action that need to stand out with a fresh, luminous pop.

background

Very light teal (#B6E6E6) provides an airy, fresh background, excellent for content areas or large sections where readability and a tranquil feel are desired.

text

Very dark teal (#0F3D3D) works well for body text on lighter backgrounds, ensuring high readability with a cohesive, natural aesthetic, or use black for maximum contrast.

Accessibility notes

  • Very dark teal (#0F3D3D) provides excellent contrast against very light teal (#B6E6E6) for readable body text.
  • Ensure sufficient contrast if using dark teal (#2B6C6C) for text on the very light teal (#B6E6E6) background.
  • Always verify that all text and interactive element contrasts meet WCAG 2.1 AA standards for optimal accessibility.
  • Avoid placing light teal (#82CACA) on very light teal (#B6E6E6) for critical text due to potential low contrast.

Recommended combinations

Jungle Depths

Creates a rich, layered depth, ideal for sophisticated backgrounds, main content sections, or elegant graphical elements.

#0F3D3D · #2B6C6C · #4D9A9A

Canopy Light

Excellent for highlights, interactive elements, or bringing a vibrant, refreshing luminosity to the design.

#82CACA · #B6E6E6 · #2B6C6C

Emerald Harmony

Provides a balanced and calming combination for subheadings, descriptive text, or subtle background patterns.

#4D9A9A · #B6E6E6 · #0F3D3D

CSS variables

:root {
  --emerald-canopy-bloom-1: #0F3D3D;
  --emerald-canopy-bloom-2: #2B6C6C;
  --emerald-canopy-bloom-3: #4D9A9A;
  --emerald-canopy-bloom-4: #82CACA;
  --emerald-canopy-bloom-5: #B6E6E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-canopy-bloom": {
        1: "#0F3D3D",
        2: "#2B6C6C",
        3: "#4D9A9A",
        4: "#82CACA",
        5: "#B6E6E6",
      }
    }
  }
}

Related searches

emerald jungle palettedeep teal green color schemelush tropical web designvibrant nature UI colorsdark green teal elegant palette

Palette colors

Hex values

Color 1#0F3D3D
·
Color 2#2B6C6C
·
Color 3#4D9A9A
·
Color 4#82CACA
·
Color 5#B6E6E6
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
3.6:1AA18
6.4:1AA
8.8:1AAA
2
2:1Fail
1.8:1Fail
3.2:1AA18
4.5:1AA18
3
3.6:1AA18
1.8:1Fail
1.8:1Fail
2.4:1Fail
4
6.4:1AA
3.2:1AA18
1.8:1Fail
1.4:1Fail
5
8.8:1AAA
4.5:1AA18
2.4:1Fail
1.4:1Fail

Similar palettes

More like Emerald Canopy Bloom

View all dark