Back to palettes

Palette

Forest Canopy

A lush and grounding palette reflecting the deep, verdant greens of an old-growth forest canopy.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2E7D32#388E3C#4CAF50#5B905B#1B5E20

Palette guide

How to use Forest Canopy

Overview

The Forest Canopy palette offers a lush and grounding collection of verdant greens, perfectly reflecting the deep, rich foliage of an old-growth forest. With shades ranging from the deep Dark Green (#1B5E20) to the slightly brighter Forest Green (#2E7D32) and Medium Green (#4CAF50), this palette is inherently natural and calming. The inclusion of Darker Green (#388E3C) and a softer, muted green (#5B905B) allows for subtle variations and depth, enabling designers and developers to craft environments that feel organic, sustainable, and serene. It's an excellent choice for projects aiming to convey environmental consciousness, health, or natural tranquility.

Best used for

  • Eco-friendly brand identity and marketing
  • Nature conservation websites and materials
  • Health and wellness app interfaces
  • Outdoor recreation gear branding
  • Sustainable architecture visualizations
  • Botanical garden or park signage

Suggested color roles

primary

Dark Green (#1B5E20) or Forest Green (#2E7D32) sets a strong, natural foundation for backgrounds or main content areas.

secondary

Darker Green (#388E3C) and Medium Green (#4CAF50) provide versatile options for secondary elements, headings, or data visualization.

accent

Medium Green (#4CAF50) can be used sparingly as a brighter highlight for interactive elements or key information.

background

A deep Dark Green (#1B5E20) provides a sophisticated, immersive backdrop. For a lighter feel, a very pale neutral background with these greens as elements works well.

text

White or a very light grey offers excellent contrast on all dark greens. For lighter backgrounds, use a deep charcoal or black.

Accessibility notes

  • Ensure sufficient contrast between different shades of green, especially for text on colored backgrounds.
  • Text in #5B905B on a background of #4CAF50 might not meet accessibility standards for small font sizes.
  • Always use a strong contrasting color like white for text on the darkest greens, such as #1B5E20.
  • Consider using a lighter green from the palette, like #5B905B, for larger headings on a darker green background for better legibility.

Recommended combinations

Deep Forest

Creates a rich, immersive backdrop for nature-focused content or branding.

#1B5E20 · #2E7D32 · #388E3C

Canopy Layers

Excellent for illustrating depth, hierarchy, or different elements within an interface.

#2E7D32 · #4CAF50 · #5B905B

Vibrant Accent

Use the brighter green as an accent against the deep primary for calls to action or highlights.

#1B5E20 · #4CAF50 · #5B905B

CSS variables

:root {
  --forest-canopy-2-1: #2E7D32;
  --forest-canopy-2-2: #388E3C;
  --forest-canopy-2-3: #4CAF50;
  --forest-canopy-2-4: #5B905B;
  --forest-canopy-2-5: #1B5E20;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "forest-canopy-2": {
        1: "#2E7D32",
        2: "#388E3C",
        3: "#4CAF50",
        4: "#5B905B",
        5: "#1B5E20",
      }
    }
  }
}

Related searches

deep green color schemeforest green designnatural green paletteeco-friendly branding colorsverdant color combinations

Palette colors

Hex values

Color 1#2E7D32
·
Color 2#388E3C
·
Color 3#4CAF50
·
Color 4#5B905B
·
Color 5#1B5E20
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.8:1Fail
1.4:1Fail
1.5:1Fail
2
1.2:1Fail
1.5:1Fail
1.1:1Fail
1.9:1Fail
3
1.8:1Fail
1.5:1Fail
1.4:1Fail
2.8:1Fail
4
1.4:1Fail
1.1:1Fail
1.4:1Fail
2.1:1Fail
5
1.5:1Fail
1.9:1Fail
2.8:1Fail
2.1:1Fail

Similar palettes

More like Forest Canopy

View all earth