Back to palettes

Palette

Jade Canopy Gaze

Lush, verdant greens mirroring the rich foliage of a deep, sun-dappled forest canopy.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#D2E7D0#A4CC9E#77AE70#4D7F48#2D4C2A

Palette guide

How to use Jade Canopy Gaze

Overview

The Jade Canopy Gaze palette immerses users in a lush, verdant experience, drawing inspiration from the rich foliage of a deep forest canopy. Ranging from the airy #D2E7D0 to the profound #2D4C2A, this earthy collection also features the vibrant #A4CC9E, the balanced #77AE70, and the robust #4D7F48. It's an excellent choice for designers and developers aiming to convey organic growth, natural beauty, and a grounded serenity. These greens are perfect for branding eco-conscious products, nature-themed websites, or any design project seeking a robust yet inviting natural aesthetic.

Best used for

  • Eco-conscious brand identity
  • Outdoor adventure websites
  • Sustainable product design
  • Botanical garden signage
  • Nature photography portfolios
  • Environmental non-profit materials

Suggested color roles

primary

Utilize #4D7F48 for main headings or key brand elements, providing a strong, natural anchor.

secondary

Apply #77AE70 for supporting content, buttons, or secondary navigation, offering a harmonious balance.

accent

Use #2D4C2A sparingly for impactful accents or important calls-to-action, adding depth and sophistication.

background

The soft #D2E7D0 makes an excellent light background, allowing the deeper greens to truly stand out.

text

For body text, #2D4C2A offers superb readability against lighter shades like #D2E7D0.

Accessibility notes

  • Ensure #2D4C2A text on #D2E7D0 background meets WCAG AAA for maximum readability.
  • Check contrast ratios for #4D7F48 and #77AE70 when used as text on #D2E7D0.
  • Avoid using #A4CC9E for small text unless on a very dark background due to lower contrast.
  • For interactive elements, ensure hover states maintain sufficient contrast against their background.

Recommended combinations

Forest Floor

Ideal for natural-themed websites, providing a sense of depth and organic growth.

#D2E7D0 · #77AE70 · #4D7F48

Canopy Depth

Excellent for branding, creating strong visual hierarchy with a touch of freshness.

#2D4C2A · #A4CC9E · #D2E7D0

Verdant Pop

Effective for infographics or UI elements that require a vibrant yet earthy feel.

#A4CC9E · #4D7F48 · #2D4C2A

CSS variables

:root {
  --jade-canopy-gaze-1: #D2E7D0;
  --jade-canopy-gaze-2: #A4CC9E;
  --jade-canopy-gaze-3: #77AE70;
  --jade-canopy-gaze-4: #4D7F48;
  --jade-canopy-gaze-5: #2D4C2A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "jade-canopy-gaze": {
        1: "#D2E7D0",
        2: "#A4CC9E",
        3: "#77AE70",
        4: "#4D7F48",
        5: "#2D4C2A",
      }
    }
  }
}

Related searches

lush green color paletteforest canopy colorsearthy jade tonesnatural green brandingorganic website colors

Palette colors

Hex values

Color 1#D2E7D0
·
Color 2#A4CC9E
·
Color 3#77AE70
·
Color 4#4D7F48
·
Color 5#2D4C2A
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2:1Fail
3.6:1AA18
7.4:1AAA
2
1.4:1Fail
1.5:1Fail
2.6:1Fail
5.4:1AA
3
2:1Fail
1.5:1Fail
1.8:1Fail
3.7:1AA18
4
3.6:1AA18
2.6:1Fail
1.8:1Fail
2:1Fail
5
7.4:1AAA
5.4:1AA
3.7:1AA18
2:1Fail

Similar palettes

More like Jade Canopy Gaze

View all earth
Ancient Jade Temple
Emerald Moss Canopy
Forest Fern Canopy
Jade Forest Canopy
Lush Forest Canopy
Monsoon Rainforest Floor