Back to palettes

Palette

Forest Canopy Light

Captures the vivid greens and golden light filtering through a dense, sun-drenched 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 Light 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 Light.

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

Data visualization

#228B22#3CB371#6B8E23#9ACD32#DAA520

Palette guide

How to use Forest Canopy Light

Overview

The Forest Canopy Light palette captures the vibrant energy of a sun-drenched woodland. Featuring lively greens like #228B22 and #3CB371, alongside the earthy olive of #6B8E23 and the brighter #9ACD32, it's crowned by a striking golden accent, #DAA520. This collection is ideal for designers seeking to evoke freshness, growth, and the invigorating spirit of nature. Its balanced blend of deep and bright greens, punctuated by a warm, inviting yellow, makes it versatile for conveying both natural vitality and optimistic brand messaging. Developers will find its clear color hierarchy useful for UI elements requiring a dynamic, yet grounded, aesthetic.

Best used for

  • Eco-friendly product branding and packaging
  • Outdoor adventure and recreation websites
  • Healthy living and wellness applications
  • Spring and summer marketing campaigns
  • Educational content about nature and botany
  • Vibrant, natural-themed illustrations

Suggested color roles

primary

Use #228B22 or #3CB371 for main brand elements, headlines, or primary call-to-action buttons, conveying vitality and freshness.

secondary

Apply #6B8E23 or #9ACD32 for supporting sections, subheadings, or secondary interactive elements, maintaining a natural flow.

accent

Reserve #DAA520 for impactful highlights, important notifications, or subtle visual cues that need to pop with a sunny warmth.

background

Utilize a very light neutral (e.g., #F8F8F8) or a subtly tinted #9ACD32 for clean, airy backgrounds, allowing other colors to shine.

text

For body text, use a dark green like #228B22 or #3CB371 for excellent readability, or a standard charcoal for maximum contrast.

Accessibility notes

  • Ensure sufficient contrast between #DAA520 and any text or interactive elements placed on it.
  • When pairing lighter greens like #9ACD32 with text, use a dark green or black for optimal readability.
  • Verify that the contrast ratio for all text and interactive elements meets WCAG 2.1 AA standards.
  • Consider using #228B22 or #3CB371 for critical information to ensure visual prominence against lighter backgrounds.

Recommended combinations

Vibrant Energy

Perfect for hero sections or calls-to-action, leveraging the deepest green, a bright supporting green, and a sunny accent.

#228B22 · #3CB371 · #DAA520

Earthy Glow

Creates a softer, more organic feel, ideal for testimonials, 'about us' sections, or natural product descriptions.

#6B8E23 · #9ACD32 · #DAA520

Fresh Contrast

A strong green base with lighter greens for depth, suitable for infographics or layered content displays emphasizing growth.

#3CB371 · #9ACD32 · #228B22

CSS variables

:root {
  --forest-canopy-light-1: #228B22;
  --forest-canopy-light-2: #3CB371;
  --forest-canopy-light-3: #6B8E23;
  --forest-canopy-light-4: #9ACD32;
  --forest-canopy-light-5: #DAA520;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "forest-canopy-light": {
        1: "#228B22",
        2: "#3CB371",
        3: "#6B8E23",
        4: "#9ACD32",
        5: "#DAA520",
      }
    }
  }
}

Related searches

vibrant green color schemeforest light branding palettenatural green and gold colorseco-friendly design palettespring summer color inspiration

Palette colors

Hex values

Color 1#228B22
·
Color 2#3CB371
·
Color 3#6B8E23
·
Color 4#9ACD32
·
Color 5#DAA520
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
1.2:1Fail
2.3:1Fail
2:1Fail
2
1.6:1Fail
1.4:1Fail
1.4:1Fail
1.2:1Fail
3
1.2:1Fail
1.4:1Fail
2:1Fail
1.7:1Fail
4
2.3:1Fail
1.4:1Fail
2:1Fail
1.2:1Fail
5
2:1Fail
1.2:1Fail
1.7:1Fail
1.2:1Fail

Similar palettes

More like Forest Canopy Light

View all earth
Botanical Groundcover Greens
Emerald Canyon Echo
Emerald Forest Canopy
Emerald Isle
Lush Fern Canopy
Lush Forest Canopy