Back to palettes

Palette

Mossy Stone Wall

Deep, muted greens and earthy tones depicting the serene beauty of a moss-covered ancient stone wall.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mossy Stone Wall 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 Stone Wall.

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

Data visualization

#4F6D59#6A8C74#8B9D8B#5C7364#3D4F44

Palette guide

How to use Mossy Stone Wall

Overview

The "Mossy Stone Wall" palette captures the serene beauty of an ancient, moss-covered stone wall, offering a deep, muted range of greens and earthy tones. From the profound #3D4F44 to the softer #8B9D8B, this palette is ideal for designs that aim for authenticity, natural texture, and understated elegance. Designers can use these hex codes to create grounding and inviting visual experiences. Developers will find this palette excellent for building interfaces that convey a sense of history, sustainability, or a connection to natural landscapes, with #6A8C74 offering a versatile mid-tone.

Best used for

  • Garden design websites
  • Historical building conservation
  • Eco-friendly product branding
  • Natural history museum exhibits
  • Rustic cafe or restaurant branding
  • Sustainable architecture portfolios

Suggested color roles

primary

#4F6D59 serves as a strong, earthy green, perfect for main content areas or headers.

secondary

#5C7364 provides a slightly darker, grounding tone, suitable for robust sections or footers.

accent

#8B9D8B offers a soft, muted highlight, ideal for subtle interactive elements or decorative touches.

background

#3D4F44 creates a deep, rich background that enhances the natural, textured feel.

text

For dark backgrounds like #3D4F44, use #8B9D8B or a near-white for optimal readability. For lighter elements, #4F6D59.

Accessibility notes

  • Ensure #8B9D8B text has sufficient contrast against #3D4F44 background.
  • Avoid using #6A8C74 text on #5C7364 backgrounds due to low contrast.
  • Interactive elements should have clear visual cues beyond just color for accessibility.
  • Verify all text and background pairings meet WCAG AAA contrast ratios if possible.

Recommended combinations

Ancient Greens

Creates a profound, historical feel, with the lightest shade for highlights or text.

#3D4F44 · #4F6D59 · #8B9D8B

Textured Stone

A harmonious blend of mid-tones, great for layered interfaces or subtle depth.

#6A8C74 · #5C7364 · #4F6D59

Mossy Depths

Uses the lightest green as a primary, with darker greens for supporting elements and strong contrast.

#8B9D8B · #3D4F44 · #6A8C74

CSS variables

:root {
  --mossy-stone-wall-1: #4F6D59;
  --mossy-stone-wall-2: #6A8C74;
  --mossy-stone-wall-3: #8B9D8B;
  --mossy-stone-wall-4: #5C7364;
  --mossy-stone-wall-5: #3D4F44;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mossy-stone-wall": {
        1: "#4F6D59",
        2: "#6A8C74",
        3: "#8B9D8B",
        4: "#5C7364",
        5: "#3D4F44",
      }
    }
  }
}

Related searches

mossy green wall paletteearthy green stone colorsnatural texture designmuted forest greenssustainable organic palette

Palette colors

Hex values

Color 1#4F6D59
·
Color 2#6A8C74
·
Color 3#8B9D8B
·
Color 4#5C7364
·
Color 5#3D4F44
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2:1Fail
1.1:1Fail
1.5:1Fail
2
1.5:1Fail
1.3:1Fail
1.4:1Fail
2.3:1Fail
3
2:1Fail
1.3:1Fail
1.8:1Fail
3:1AA18
4
1.1:1Fail
1.4:1Fail
1.8:1Fail
1.7:1Fail
5
1.5:1Fail
2.3:1Fail
3:1AA18
1.7:1Fail

Similar palettes

More like Mossy Stone Wall

View all earth
Verdant Moss Stone
Ancient Mossy Stone
Ancient Temple Moss
Emerald Canopy Hush
Emerald Coast Moss
Enchanted Moss Garden