Back to palettes

Palette

Green Moss Harmony

A peaceful spectrum of greens, ranging from deep forest to bright olive, reflecting the quiet harmony of a mossy grove.

monochromenatural5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Green Moss Harmony 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 Green Moss Harmony.

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

Data visualization

#2F4F2F#4F6F4F#6B8E23#9ACD32#ADFF2F

Palette guide

How to use Green Moss Harmony

Overview

Discover the tranquil essence of the Green Moss Harmony palette, a verdant collection that brings the serenity of a forest floor to your designs. This monochromatic green spectrum ranges from the deep, grounding #2F4F2F (Dark Forest) to the vibrant, refreshing #ADFF2F (Bright Chartreuse), with a lively #9ACD32 (Lime Green) providing a cheerful accent. Ideal for projects seeking a natural, organic, or eco-friendly aesthetic, this palette offers a harmonious blend of earthy tones. Designers and developers can leverage its depth for branding, web interfaces, or illustrative work that aims to evoke calm, growth, and connection with nature. Its diverse shades ensure adaptability across various design elements.

Best used for

  • Eco-friendly brand identity
  • Nature-themed websites or apps
  • Sustainable product packaging
  • Outdoor adventure gear branding
  • Health and wellness marketing materials
  • Botanical illustrations

Suggested color roles

primary

Use #2F4F2F as a foundational deep green for headers, main sections, or brand logos, providing stability and depth.

secondary

Apply #4F6F4F for subheadings, secondary buttons, or large content blocks, offering a gentler green that complements the primary.

accent

Employ #ADFF2F sparingly for calls-to-action, interactive elements, or highlights to draw attention with its bright, energetic hue.

background

Utilize #ADFF2F for light, airy backgrounds, or #4F6F4F for a more subdued, natural canvas that allows darker elements to stand out.

text

For optimal readability, use a dark text color like #2F4F2F against lighter backgrounds, or white/near-white against darker shades.

Accessibility notes

  • Ensure sufficient contrast between #2F4F2F text and #ADFF2F backgrounds for WCAG AA compliance.
  • Be cautious with lighter greens like #9ACD32 for small text on similarly light backgrounds like #ADFF2F; opt for darker contrasts.
  • When pairing #6B8E23 with #4F6F4F, verify readability, especially for body text.
  • Always test color combinations with accessibility checkers to meet minimum contrast ratios for all users.

Recommended combinations

Forest Canopy

Ideal for high-impact calls-to-action or vibrant headers against a deep, grounding base.

#2F4F2F · #ADFF2F · #9ACD32

Mossy Path

Creates a harmonious, natural feel for content blocks, illustrations, or subtle branding elements.

#4F6F4F · #6B8E23 · #2F4F2F

Spring Growth

Use for fresh, energetic designs where a lighter background supports vibrant interactive components.

#ADFF2F · #6B8E23 · #4F6F4F

CSS variables

:root {
  --green-moss-harmony-1: #2F4F2F;
  --green-moss-harmony-2: #4F6F4F;
  --green-moss-harmony-3: #6B8E23;
  --green-moss-harmony-4: #9ACD32;
  --green-moss-harmony-5: #ADFF2F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "green-moss-harmony": {
        1: "#2F4F2F",
        2: "#4F6F4F",
        3: "#6B8E23",
        4: "#9ACD32",
        5: "#ADFF2F",
      }
    }
  }
}

Related searches

monochrome green palettenature inspired colorsforest green color schemeeco friendly branding colorscalm green web design

Palette colors

Hex values

Color 1#2F4F2F
·
Color 2#4F6F4F
·
Color 3#6B8E23
·
Color 4#9ACD32
·
Color 5#ADFF2F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.4:1Fail
4.9:1AA
7.5:1AAA
2
1.6:1Fail
1.5:1Fail
3:1Fail
4.6:1AA
3
2.4:1Fail
1.5:1Fail
2:1Fail
3.1:1AA18
4
4.9:1AA
3:1Fail
2:1Fail
1.5:1Fail
5
7.5:1AAA
4.6:1AA
3.1:1AA18
1.5:1Fail

Similar palettes

More like Green Moss Harmony

View all monochrome