Palette

Mossy River Bed

Serene greens and earthy browns reflecting a tranquil riverbed, carpeted with soft, vibrant moss.

earthnatural5 colors

More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mossy River Bed 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 Mossy River Bed.

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

Data visualization

#304D36#5C7D64#91AE92#D2D9C5#6B7C72

Palette guide

How to use Mossy River Bed

Overview

The "Mossy River Bed" palette evokes a sense of serene tranquility, mirroring the calm of a riverbed carpeted in soft, vibrant moss. This collection features harmonious greens, from the deep #304D36 to the soft #D2D9C5, complemented by the balanced #6B7C72. Designers will find this palette ideal for creating calming, natural, and inviting interfaces. Developers can utilize these hex codes to build digital experiences that promote relaxation, sustainability, or a connection to nature, offering a gentle yet distinct visual identity that feels both fresh and established.

Best used for

Wellness and mindfulness apps
Eco-conscious product design
Spa and retreat branding
Nature photography portfolios
Sustainable living blogs
Children's educational content (nature focus)

Suggested color roles

primary

#5C7D64 serves as a welcoming, mid-tone green, perfect for main content areas or headers.

secondary

#304D36 provides a deeper, grounding counterpoint, suitable for robust sections or footers.

accent

#91AE92 offers a soft, airy accent, ideal for subtle highlights or interactive elements.

background

#D2D9C5 creates a light, fresh, and expansive background, allowing other colors to breathe.

text

For light backgrounds, #304D36 or #5C7D64 offer excellent readability. For darker elements, a crisp white.

Accessibility notes

Ensure #304D36 text has sufficient contrast against #D2D9C5 for readability.
Avoid using #91AE92 text on #D2D9C5 backgrounds due to very low contrast.
Interactive elements should have clear visual cues beyond just color differences.
Verify all text and background combinations meet WCAG contrast ratios.

Recommended combinations

Serene Flow

A light, airy combination that grounds with deeper tones, perfect for elegant layouts.

#D2D9C5 · #5C7D64 · #304D36

Lush Depths

Creates a rich, deep natural feel, ideal for headers or prominent visual sections.

#304D36 · #6B7C72 · #91AE92

Gentle Greens

A soft, harmonious blend for calming interfaces or background elements.

#5C7D64 · #D2D9C5 · #6B7C72

CSS variables

:root {
  --mossy-river-bed-1: #304D36;
  --mossy-river-bed-2: #5C7D64;
  --mossy-river-bed-3: #91AE92;
  --mossy-river-bed-4: #D2D9C5;
  --mossy-river-bed-5: #6B7C72;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mossy-river-bed": {
        1: "#304D36",
        2: "#5C7D64",
        3: "#91AE92",
        4: "#D2D9C5",
        5: "#6B7C72",
      }
    }
  }
}

Hex values

Color 1#304D36

Color 2#5C7D64

Color 3#91AE92

Color 4#D2D9C5

Color 5#6B7C72

Accessibility

Contrast checker

2:1Fail

3.9:1AA18

6.5:1AA

2.1:1Fail

2:1Fail

1.9:1Fail

3.2:1AA18

1:1Fail

3.9:1AA18

1.9:1Fail

1.7:1Fail

1.8:1Fail

6.5:1AA

3.2:1AA18

1.7:1Fail

3:1AA18

2.1:1Fail

1:1Fail

1.8:1Fail

3:1AA18

Similar palettes

More like Mossy River Bed

View all earth

Verdant Undergrowth Shade

Emerald Canopy Hush

Enchanted Moss Garden

Forest Fern Canopy

Forest Floor Echo

Forest Floor Moss