Back to palettes

Palette

Woodland Canopy Greens

A rich, organic journey through a sun-dappled forest, alive with varied greens and muted light.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#224D28#3A664E#6B8E23#A1B057#D1DBA6

Palette guide

How to use Woodland Canopy Greens

Overview

The Woodland Canopy Greens palette offers a rich, organic journey through a sun-dappled forest, alive with varied greens and muted light. This natural collection features the deep forest green #224D28, the vibrant moss green #3A664E, and the lively olive #6B8E23, creating a harmonious and grounded feel. The lighter #A1B057 and the ethereal #D1DBA6 complete the spectrum, providing a versatile range for designers and developers. Ideal for projects that require an authentic, refreshing, or natural aesthetic, this palette can transform digital interfaces, branding, and print materials into truly harmonious and inviting experiences, evoking the serene beauty of a forest canopy.

Best used for

  • eco-friendly brand identity
  • nature conservation websites
  • organic food packaging
  • outdoor adventure gear branding
  • wellness and mindfulness apps
  • garden and landscape design

Suggested color roles

primary

A deep forest green #224D28, excellent for primary navigation, headers, or significant brand elements, establishing a strong, natural foundation.

secondary

The vibrant moss green #3A664E, perfect for subheadings, interactive components, or background sections that need an organic yet lively presence.

accent

The lively olive #6B8E23, ideal for calls-to-action, key icons, or crucial highlights that require immediate attention and a touch of natural vibrancy.

background

The ethereal #D1DBA6 serves as an excellent light, airy canvas, providing freshness for backgrounds that enhance the natural feel.

text

The deep forest green #224D28 offers superb readability against lighter shades, making it suitable for body text, labels, and fine print, or use a dark brown for softer contrast.

Accessibility notes

  • Ensure #224D28 or #3A664E has strong contrast against #D1DBA6 for body text to meet WCAG AA standards.
  • Avoid using #A1B057 and #6B8E23 in close proximity for text or interactive elements due to potential low contrast.
  • For small text or critical information, consider using a dark charcoal or black against the lightest shade.
  • When using #D1DBA6 as a background, verify that all overlaying text and UI elements have sufficient luminosity contrast.

Recommended combinations

Deep Foliage

Creates a profound, organic aesthetic suitable for immersive backgrounds, sophisticated headers, or natural UI components.

#224D28 · #3A664E · #6B8E23

Sun-Dappled

Highlights important information with a vibrant accent and ensures readability, perfect for CTAs and prominent text.

#3A664E · #A1B057 · #D1DBA6

Canopy Light

A balanced combination for content blocks, offering a rich mid-tone, a deep background, and a bright, legible text color.

#6B8E23 · #224D28 · #D1DBA6

CSS variables

:root {
  --woodland-canopy-greens-1: #224D28;
  --woodland-canopy-greens-2: #3A664E;
  --woodland-canopy-greens-3: #6B8E23;
  --woodland-canopy-greens-4: #A1B057;
  --woodland-canopy-greens-5: #D1DBA6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "woodland-canopy-greens": {
        1: "#224D28",
        2: "#3A664E",
        3: "#6B8E23",
        4: "#A1B057",
        5: "#D1DBA6",
      }
    }
  }
}

Related searches

forest green color palettewoodland nature colorsmoss green designearthy green brandingnatural foliage scheme

Palette colors

Hex values

Color 1#224D28
·
Color 2#3A664E
·
Color 3#6B8E23
·
Color 4#A1B057
·
Color 5#D1DBA6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.6:1Fail
4.1:1AA18
6.7:1AA
2
1.5:1Fail
1.7:1Fail
2.8:1Fail
4.5:1AA
3
2.6:1Fail
1.7:1Fail
1.6:1Fail
2.6:1Fail
4
4.1:1AA18
2.8:1Fail
1.6:1Fail
1.6:1Fail
5
6.7:1AA
4.5:1AA
2.6:1Fail
1.6:1Fail

Similar palettes

More like Woodland Canopy Greens

View all earth
Emerald Enclave Moss
Emerald Moss Canopy
Enchanted Forest Lumina
Forest Floor Canopy
Forest Floor Gems
Forest Fungi Moss