Palette

Forest Moss Path

Verdant and peaceful, reminiscent of a quiet, moss-covered path deep within an ancient forest.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1B5E20#388E3C#66BB6A#A5D6A7#C8E6C9

Palette guide

How to use Forest Moss Path

Overview

The Forest Moss Path palette is a verdant and peaceful collection of greens, reminiscent of a quiet, moss-covered path deep within an ancient forest. It features a rich, dark green #1B5E20, a vibrant forest green #388E3C, a bright, lively green #66BB6A, a soft, light green #A5D6A7, and a very pale, fresh green #C8E6C9. This collection of hex codes is ideal for designers seeking to evoke freshness, growth, tranquility, and natural vitality. Developers can integrate these colors into eco-conscious branding, outdoor adventure apps, or nature-themed websites, ensuring a cohesive and engaging visual experience that feels both grounded and invigorating.

Best used for

Eco-friendly lifestyle brands
Outdoor sports and adventure apps
Nature conservation organization websites
Gardening and landscaping services branding
Healthy food and beverage packaging
Environmental education platforms

Suggested color roles

primary

#1B5E20 - A rich, dark green, perfect for primary branding elements, robust headers, or foundational content blocks, providing strong depth.

secondary

#388E3C - A vibrant forest green that works well for secondary content, navigation, or larger text, offering a lively natural feel.

accent

#66BB6A - A bright, lively green ideal for drawing attention to calls to action, interactive elements, or adding a fresh pop of color.

background

#C8E6C9 - A very pale, fresh green that provides a clean, airy canvas, enhancing readability for darker text and maintaining a light, natural mood.

text

#1B5E20 - Excellent for body text on the light #C8E6C9 background, ensuring strong readability. A dark charcoal or black can also be used for maximum contrast.

Accessibility notes

Ensure #1B5E20 or #388E3C text on #C8E6C9 background meets WCAG AA contrast for readability, striving for AAA where possible.
Avoid using #A5D6A7 or #66BB6A for small text on #C8E6C9 as the contrast will likely be insufficient.
Use #66BB6A for larger graphical elements or as a background for darker text to improve visibility.
Always verify contrast ratios for interactive elements, especially buttons and links, to guarantee accessibility.

Recommended combinations

Fresh Path

A crisp, readable combination for main content, with a light green background, dark text, and a vibrant green for accents.

#C8E6C9 · #1B5E20 · #388E3C

Verdant Layers

Creates an energetic, natural feel for headers or feature sections, blending deep green with lively and light accents.

#1B5E20 · #66BB6A · #A5D6A7

Growth Contrast

A clear yet vibrant combination for cards or testimonials, offering good contrast with a touch of fresh green.

#C8E6C9 · #388E3C · #1B5E20

CSS variables

:root {
  --forest-moss-path-1: #1B5E20;
  --forest-moss-path-2: #388E3C;
  --forest-moss-path-3: #66BB6A;
  --forest-moss-path-4: #A5D6A7;
  --forest-moss-path-5: #C8E6C9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "forest-moss-path": {
        1: "#1B5E20",
        2: "#388E3C",
        3: "#66BB6A",
        4: "#A5D6A7",
        5: "#C8E6C9",
      }
    }
  }
}

Hex values

Color 1#1B5E20

Color 2#388E3C

Color 3#66BB6A

Color 4#A5D6A7

Color 5#C8E6C9

Accessibility

Contrast checker

1.9:1Fail

3.3:1AA18

4.8:1AA

5.9:1AA

1.9:1Fail

1.7:1Fail

2.5:1Fail

3.1:1AA18

3.3:1AA18

1.7:1Fail

1.4:1Fail

1.8:1Fail

4.8:1AA

2.5:1Fail

1.4:1Fail

1.2:1Fail

5.9:1AA

3.1:1AA18

1.8:1Fail

1.2:1Fail

Similar palettes

More like Forest Moss Path

View all earth

Herbal Garden Fresh

Lush Herb Garden

Whispering Meadow Breeze

Apothecary Bloom Green

Bamboo Serene Path

Botanical Bloom Burst