Palette

Canopy Emerald Burst

A vibrant and rich assortment of greens, embodying the dense life of a rainforest.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0D3E1A#1A5E2E#3D8C4D#6FC77D#A7E0B3

Palette guide

How to use Canopy Emerald Burst

Overview

The Canopy Emerald Burst palette is a vibrant and rich assortment of greens, embodying the dense life of a rainforest canopy. Ranging from the deep forest green of #0D3E1A to the lush emerald of #1A5E2E, and through the brighter tones of #3D8C4D and #6FC77D, culminating in the airy #A7E0B3, this gradient of greens offers depth and natural sophistication. It's an excellent choice for designers seeking to convey growth, vitality, and a strong connection to nature. This palette is perfect for projects that require a fresh, organic, and visually immersive aesthetic.

Best used for

Eco-friendly product branding and packaging
Nature and wildlife documentary graphics
Outdoor adventure and tourism marketing
Sustainable living website design
Botanical garden or nature reserve branding
Interior design for serene, biophilic spaces

Suggested color roles

primary

Use #0D3E1A (Deep Forest Green) for dominant backgrounds or robust headers to establish a strong, natural foundation.

secondary

Employ #1A5E2E (Emerald Green) for sub-sections, navigation, or as a rich, complementary tone.

accent

Apply #6FC77D (Bright Green) sparingly for call-to-action buttons, key highlights, or interactive elements to add vitality.

background

The light #A7E0B3 (Pale Green) provides an airy, fresh canvas, allowing deeper greens to stand out, or use a neutral cream.

text

For optimal readability, use white or light grey text on #0D3E1A and #1A5E2E, and dark charcoal or black text on #6FC77D and #A7E0B3.

Accessibility notes

Ensure white text on #0D3E1A and #1A5E2E has sufficient contrast for readability.
Dark text (e.g., #333333) is essential on #6FC77D and #A7E0B3 for accessibility.
When creating gradients or overlays, ensure text remains legible across varying green shades.
Avoid pairing very similar mid-tones for critical information without checking contrast ratios.

Recommended combinations

Deep Forest

Ideal for establishing a sophisticated, deep nature theme for branding or large content blocks.

#0D3E1A · #1A5E2E · #3D8C4D

Lush Canopy

Perfect for creating a sense of growth and freshness, suitable for web backgrounds or illustrations.

#3D8C4D · #6FC77D · #A7E0B3

Emerald Glow

Great for highlighting natural elements, interactive features, or a vibrant eco-conscious design.

#1A5E2E · #6FC77D · #A7E0B3

CSS variables

:root {
  --canopy-emerald-burst-1: #0D3E1A;
  --canopy-emerald-burst-2: #1A5E2E;
  --canopy-emerald-burst-3: #3D8C4D;
  --canopy-emerald-burst-4: #6FC77D;
  --canopy-emerald-burst-5: #A7E0B3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "canopy-emerald-burst": {
        1: "#0D3E1A",
        2: "#1A5E2E",
        3: "#3D8C4D",
        4: "#6FC77D",
        5: "#A7E0B3",
      }
    }
  }
}

Hex values

Color 1#0D3E1A

Color 2#1A5E2E

Color 3#3D8C4D

Color 4#6FC77D

Color 5#A7E0B3

Accessibility

Contrast checker

1.6:1Fail

2.9:1Fail

5.9:1AA

8.1:1AAA

1.6:1Fail

1.9:1Fail

3.8:1AA18

5.2:1AA

2.9:1Fail

1.9:1Fail

2:1Fail

2.8:1Fail

5.9:1AA

3.8:1AA18

2:1Fail

1.4:1Fail

8.1:1AAA

5.2:1AA

2.8:1Fail

1.4:1Fail

Similar palettes

More like Canopy Emerald Burst

View all earth

Emerald Canopy Shroud

Emerald Rainforest Mist

Jungle Canopy

Lush Rainforest Floor

Monsoon Rainforest Mist

Rainforest Canopy Dew