Back to palettes

Palette

Ancient Ruin Whisper

Captures the serene beauty of overgrown ruins, where moss and time intertwine.

EarthCalm5 colors
More Earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Ancient Ruin Whisper 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 Ruin Whisper.

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

Data visualization

#3A4E39#6B7D5F#8E9E7F#576F5E#CED8BF

Palette guide

How to use Ancient Ruin Whisper

Overview

The 'Ancient Ruin Whisper' palette captures the serene beauty of overgrown ruins, where moss and time intertwine. This earthy collection of natural greens, from the deep #3A4E39 to the airy #CED8BF, with versatile mid-tones like #6B7D5F, is perfect for designers and developers seeking a calm, organic aesthetic. It evokes a sense of tranquil growth and historical depth, making it ideal for projects that emphasize nature, sustainability, or quiet contemplation. The subtle variations allow for rich, nuanced designs that feel both ancient and alive.

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 #3A4E39 as a deep, grounding green for primary elements like headers or main content blocks, providing stability.

secondary

Apply #6B7D5F as a muted, natural mid-green for supporting sections, subheadings, or subtle graphical accents.

accent

Introduce #576F5E, a slightly cooler green, for delicate highlights, interactive elements, or botanical illustrations, adding subtle contrast.

background

Employ #CED8BF as a light, airy, and natural base for your design, ensuring a fresh and serene canvas.

text

For crisp readability, use #3A4E39 for all body text and headings, especially against lighter backgrounds like #CED8BF.

Accessibility notes

  • Ensure #3A4E39 text on #CED8BF background meets WCAG AA contrast standards.
  • Use #6B7D5F for larger text on #8E9E7F for improved readability and visual harmony.
  • Avoid using #8E9E7F for small text on #CED8BF due to potential low contrast.
  • Provide clear focus indicators for interactive elements to ensure usability for all users.

Recommended combinations

Deep Moss

Creates a rich, organic depth suitable for background textures or prominent visual elements.

#3A4E39 · #576F5E · #6B7D5F

Overgrown Stone

Ideal for layered backgrounds, subtle gradients, or elements that evoke a soft, natural progression.

#6B7D5F · #8E9E7F · #CED8BF

Forest Whisper

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

#3A4E39 · #CED8BF · #8E9E7F

CSS variables

:root {
  --ancient-ruin-whisper-1: #3A4E39;
  --ancient-ruin-whisper-2: #6B7D5F;
  --ancient-ruin-whisper-3: #8E9E7F;
  --ancient-ruin-whisper-4: #576F5E;
  --ancient-ruin-whisper-5: #CED8BF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "ancient-ruin-whisper": {
        1: "#3A4E39",
        2: "#6B7D5F",
        3: "#8E9E7F",
        4: "#576F5E",
        5: "#CED8BF",
      }
    }
  }
}

Related searches

moss green paletteancient nature colorsserene green hexorganic brand designovergrown ruins aesthetic

Palette colors

Hex values

Color 1#3A4E39
·
Color 2#6B7D5F
·
Color 3#8E9E7F
·
Color 4#576F5E
·
Color 5#CED8BF
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
3.2:1AA18
1.6:1Fail
6.1:1AA
2
2:1Fail
1.6:1Fail
1.2:1Fail
3:1AA18
3
3.2:1AA18
1.6:1Fail
1.9:1Fail
1.9:1Fail
4
1.6:1Fail
1.2:1Fail
1.9:1Fail
3.7:1AA18
5
6.1:1AA
3:1AA18
1.9:1Fail
3.7:1AA18

Similar palettes

More like Ancient Ruin Whisper

View all Earth
Cactus Flower Dusk
Desert Twilight Haze
Jade Mountain Sanctuary
Moonlit Savannah Dusk
Rain-Kissed Meadow
Whispering Dune Breeze