Palette

Verdant Canopy

Deep, lush greens reminiscent of a vibrant, sun-dappled rainforest canopy.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2E8B57#3CB371#66CDAA#2F4F4F#006400

Palette guide

How to use Verdant Canopy

Overview

The Verdant Canopy palette presents a collection of deep, lush greens reminiscent of a vibrant, sun-dappled rainforest. With rich tones like the primary `#2E8B57` and the profound `#006400`, complemented by the refreshing `#3CB371` and a sophisticated `#2F4F4F` dark accent, this palette is ideal for conveying natural abundance and vitality. Designers and developers can utilize these hex codes to craft immersive digital experiences or bold brand identities that evoke the untamed beauty of a jungle. It offers a strong, confident range of greens that work well for both striking visuals and harmonious, nature-inspired designs.

Best used for

Tropical resort or travel agency branding
Environmental awareness campaigns
Outdoor gear and adventure apparel websites
Botanical garden exhibits and signage
Educational platforms about ecosystems
Lively app interfaces for nature exploration

Suggested color roles

primary

Use `#3CB371` as the vibrant main green, conveying growth and vitality.

secondary

Employ `#006400` for deep anchors, strong headings, or footers, providing a solid foundation.

accent

Apply `#66CDAA` for bright, refreshing highlights, interactive elements, or key calls to action.

background

Utilize `#2F4F4F` as a sophisticated dark background, or a clean near-white for high contrast.

text

Choose `#006400` for primary text on light backgrounds for excellent readability, or `#66CDAA` on dark backgrounds.

Accessibility notes

Ensure `#006400` and `#2F4F4F` text on a pure white or very light background provides strong contrast.
If using `#2F4F4F` as a background, `#66CDAA` offers good contrast for text, meeting WCAG AA standards.
Avoid using `#66CDAA` for small text on light or medium green backgrounds due to potential low contrast.
Always verify contrast ratios for all text and UI elements to ensure accessibility for all users.

Recommended combinations

Lush Depth

Creates a rich, layered look, perfect for conveying depth and natural abundance.

#006400 · #3CB371 · #66CDAA

Modern Forest

Ideal for sophisticated designs, balancing dark, muted tones with a vibrant accent.

#2F4F4F · #2E8B57 · #66CDAA

Vibrant Accent

Excellent for dynamic visuals where a strong, harmonious green presence is desired.

#3CB371 · #2E8B57 · #006400

CSS variables

:root {
  --verdant-canopy-1: #2E8B57;
  --verdant-canopy-2: #3CB371;
  --verdant-canopy-3: #66CDAA;
  --verdant-canopy-4: #2F4F4F;
  --verdant-canopy-5: #006400;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "verdant-canopy": {
        1: "#2E8B57",
        2: "#3CB371",
        3: "#66CDAA",
        4: "#2F4F4F",
        5: "#006400",
      }
    }
  }
}

Hex values

Color 1#2E8B57

Color 2#3CB371

Color 3#66CDAA

Color 4#2F4F4F

Color 5#006400

Accessibility

Contrast checker

1.6:1Fail

2.2:1Fail

2.1:1Fail

1.8:1Fail

1.6:1Fail

1.4:1Fail

3.3:1AA18

2.8:1Fail

2.2:1Fail

1.4:1Fail

4.6:1AA

3.9:1AA18

2.1:1Fail

3.3:1AA18

4.6:1AA

1.2:1Fail

1.8:1Fail

2.8:1Fail

3.9:1AA18

1.2:1Fail

Similar palettes

More like Verdant Canopy

View all earth

Verdant Jungle Fringe

Emerald Canopy Shroud

Emerald Moss Canopy

Forest Fern Canopy

Jade Canopy Gaze

Jungle Canopy Emerald