Palette

Verdant Moss Path

A tranquil journey through a lush, damp forest floor, rich with shades of deep green moss.

earthcalm5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#4A6D56#7C986D#BCC09E#324D3C#5E7A6B

Palette guide

How to use Verdant Moss Path

Overview

The Verdant Moss Path palette invites a tranquil journey through a lush, damp forest floor, rich with shades of deep green moss. This collection gracefully transitions from the profound #324D3C to the subtle #BCC09E, offering a sophisticated and calming array of organic hues. The versatile mid-tones, such as the earthy #4A6D56 and the muted #5E7A6B, provide excellent opportunities for creating depth and visual interest. This palette is ideal for designs aiming to convey peacefulness, natural elegance, and a sense of quiet contemplation. Designers will find these hex codes perfect for crafting harmonious visuals, while developers can easily implement them for cohesive and inviting user interfaces.

Best used for

Mindfulness and meditation app interfaces
Eco-friendly home goods branding
Serene nature photography portfolios
Wellness retreat marketing materials
Sustainable fashion lookbooks
Artisan craft product packaging

Suggested color roles

primary

#324D3C - A deep, grounding forest green, excellent for establishing a strong, calming brand presence, main headings, or foundational elements.

secondary

#4A6D56 - A slightly lighter, yet still rich and earthy green, perfect for supporting visuals, subheadings, or significant graphical elements.

accent

#7C986D - A gentle, muted sage green that adds a soft touch of freshness, ideal for interactive elements, subtle highlights, or decorative patterns.

background

#BCC09E - A very light, almost grey-green, creating an open and airy backdrop that promotes readability and a serene feel.

text

#324D3C - This deep green offers excellent contrast against the light #BCC09E background, ensuring readability for body text and maintaining the palette's sophisticated, natural aesthetic.

Accessibility notes

Ensure #324D3C text on #BCC09E background meets WCAG AA contrast for body text.
Avoid using #7C986D or #5E7A6B for small text on #BCC09E due to potential low contrast.
Use #4A6D56 for larger headings on #BCC09E, but verify readability for smaller sizes.
For interactive elements, use distinct hover and focus states that provide clear visual feedback.

Recommended combinations

Tranquil Depths

Effective for creating a strong, yet subtle brand presence, with the darkest green as primary and the lightest for clean text.

#324D3C · #4A6D56 · #BCC09E

Mossy Layers

Ideal for subtle background textures, infographics, or sections requiring a soft, harmonious blend of greens.

#7C986D · #5E7A6B · #4A6D56

Quiet Path

A calming and readable layout for content, with #BCC09E as the page background, #324D3C for text, and #7C986D for links or accents.

#BCC09E · #324D3C · #7C986D

CSS variables

:root {
  --verdant-moss-path-1: #4A6D56;
  --verdant-moss-path-2: #7C986D;
  --verdant-moss-path-3: #BCC09E;
  --verdant-moss-path-4: #324D3C;
  --verdant-moss-path-5: #5E7A6B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "verdant-moss-path": {
        1: "#4A6D56",
        2: "#7C986D",
        3: "#BCC09E",
        4: "#324D3C",
        5: "#5E7A6B",
      }
    }
  }
}

Hex values

Color 1#4A6D56

Color 2#7C986D

Color 3#BCC09E

Color 4#324D3C

Color 5#5E7A6B

Accessibility

Contrast checker

1.8:1Fail

3.1:1AA18

1.6:1Fail

1.2:1Fail

1.8:1Fail

1.7:1Fail

2.9:1Fail

1.5:1Fail

3.1:1AA18

1.7:1Fail

4.9:1AA

2.5:1Fail

1.6:1Fail

2.9:1Fail

4.9:1AA

2:1Fail

1.2:1Fail

1.5:1Fail

2.5:1Fail

2:1Fail

Similar palettes

More like Verdant Moss Path

View all earth

Ancient Moss Rune

Verdant Moss Whisper

Ancient Forest Hearth

Ancient Grove Calm

Ancient Moss Whisper

Bamboo Grove