Palette

Ancient Temple Moss

A harmonious blend of muted greens, echoing the tranquil beauty of moss growing on ancient stone.

monochromenatural5 colors

More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ancient Temple Moss 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 Ancient Temple Moss.

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

Data visualization

#4A5D4D#778A77#A4B9A4#C6DBC6#D9EAE0

Palette guide

How to use Ancient Temple Moss

Overview

The 'Ancient Temple Moss' palette offers a harmonious blend of muted greens, echoing the tranquil beauty of moss growing on ancient stone. With shades ranging from the deep #4A5D4D to the airy #D9EAE0, and including versatile mid-tones like #A4B9A4, this monochrome, natural, and tranquil palette is perfect for designers and developers crafting serene, organic, and historically resonant designs. It provides a cohesive framework for creating depth, emphasizing natural textures, and ensuring a calm atmosphere, ideal for projects that convey growth, preservation, and a quiet sense of timeless beauty.

Best used for

Eco-friendly brand identities
Nature conservation initiatives
Garden design and landscaping
Organic product packaging
Meditation and wellness apps
Historical nature documentaries

Suggested color roles

primary

Utilize #4A5D4D as a deep, grounding moss green for primary elements, such as headers or main content blocks, providing stability.

secondary

Apply #778A77 as a mid-tone, muted green for supporting sections, subheadings, or subtle graphical accents, adding visual depth.

accent

Introduce #A4B9A4 as a lighter, subtle green for interactive elements, delicate details, or to create visual separation without harshness.

background

Employ #D9EAE0 as a very light, airy green-white background, offering a clean and expansive canvas with a tranquil feel.

text

For optimal readability, use #4A5D4D for all body text and headings, ensuring strong contrast against lighter backgrounds like #D9EAE0.

Accessibility notes

Ensure #4A5D4D text on #D9EAE0 background meets WCAG AA contrast standards for readability.
Use #778A77 for larger headings on #C6DBC6 for improved visual distinction.
Avoid using #A4B9A4 for small text on #C6DBC6 due to potential low contrast.
Check contrast for all interactive elements to ensure consistent legibility and usability.

Recommended combinations

Deep Moss

Creates a rich, organic depth suitable for prominent content blocks, footers, or deep textural backgrounds.

#4A5D4D · #778A77 · #A4B9A4

Mossy Stone

Ideal for layered backgrounds, subtle gradients, or overlays that evoke light, ethereal moss textures.

#A4B9A4 · #C6DBC6 · #D9EAE0

Tranquil Temple

A contrasting yet serene combination for titles, hero sections, or key informational graphics.

#778A77 · #D9EAE0 · #4A5D4D

CSS variables

:root {
  --ancient-temple-moss-2-1: #4A5D4D;
  --ancient-temple-moss-2-2: #778A77;
  --ancient-temple-moss-2-3: #A4B9A4;
  --ancient-temple-moss-2-4: #C6DBC6;
  --ancient-temple-moss-2-5: #D9EAE0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ancient-temple-moss-2": {
        1: "#4A5D4D",
        2: "#778A77",
        3: "#A4B9A4",
        4: "#C6DBC6",
        5: "#D9EAE0",
      }
    }
  }
}

Hex values

Color 1#4A5D4D

Color 2#778A77

Color 3#A4B9A4

Color 4#C6DBC6

Color 5#D9EAE0

Accessibility

Contrast checker

1.9:1Fail

3.4:1AA18

4.8:1AA

5.7:1AA

1.9:1Fail

1.8:1Fail

2.5:1Fail

3:1Fail

3.4:1AA18

1.8:1Fail

1.4:1Fail

1.7:1Fail

4.8:1AA

2.5:1Fail

1.4:1Fail

1.2:1Fail

5.7:1AA

3:1Fail

1.7:1Fail

1.2:1Fail

Similar palettes

More like Ancient Temple Moss

View all monochrome

Emerald Canopy Sun

Emerald Glade

Forest Canopy Verdant

Green Moss Harmony

Rainforest Bloom

Verdant Canopy Shade