Back to palettes

Palette

Wetland Hues

Earthy greens and muted yellows, capturing the serene and subtly magical feel of a tranquil marshland.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Wetland Hues 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 Wetland Hues.

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

Data visualization

#8A9A5B#C2CC8B#E0E5C0#75864C#AAB97E

Palette guide

How to use Wetland Hues

Overview

The 'Wetland Hues' palette brings forth the serene and earthy essence of a tranquil marshland with its array of muted greens and soft yellows. Featuring a grounding #75864C, a vibrant #8A9A5B, and lighter tones like #C2CC8B, #AAB97E, and the almost-neutral #E0E5C0, this collection is perfect for designers and developers aiming for a natural, organic, and subtly playful aesthetic. It evokes a sense of calm and connection to nature, suitable for projects that value authenticity and understated beauty.

Best used for

  • Eco-friendly product branding and packaging
  • Nature conservation websites or apps
  • Organic food and beverage marketing
  • Wellness and mindfulness platforms
  • Garden design and landscaping businesses
  • Children's educational content with a natural theme

Suggested color roles

primary

Utilize #75864C as a foundational primary, lending a deep, stable natural feel to backgrounds or key structural elements.

secondary

Employ #8A9A5B or #AAB97E for secondary sections, cards, or large graphical elements, providing a refreshing mid-tone.

accent

Use #C2CC8B for subtle highlights, interactive elements, or soft visual cues, and #E0E5C0 for backgrounds that require a very light, almost neutral green.

background

Set #E0E5C0 as a default light background for a fresh, clean feel, or #75864C for a deeper, more immersive natural base.

text

For lighter backgrounds like #E0E5C0, use #75864C or #8A9A5B for primary text. On darker backgrounds, a near-white or very light cream text will ensure readability.

Accessibility notes

  • Ensure sufficient contrast when pairing lighter shades like #E0E5C0 with mid-tones such as #C2CC8B, especially for text.
  • The darker greens #75864C and #8A9A5B offer good contrast for light text, making them suitable for headings or calls-to-action.
  • Avoid using similar light greens for adjacent interactive elements to prevent confusion for users with visual impairments.
  • Test all text and icon colors against their backgrounds to meet WCAG guidelines; aim for AAA where possible for critical content.

Recommended combinations

Forest Floor

Creates a natural gradient from deep green to light cream, perfect for layered backgrounds or distinct sections.

#75864C · #AAB97E · #E0E5C0

Marsh Bloom

A balanced combination for a fresh, organic feel, with a strong primary green and lighter supporting hues.

#8A9A5B · #C2CC8B · #75864C

Dewdrop Light

Ideal for a very light, airy design, using the deeper greens for emphasis and readability on a pale base.

#E0E5C0 · #AAB97E · #8A9A5B

CSS variables

:root {
  --wetland-hues-1: #8A9A5B;
  --wetland-hues-2: #C2CC8B;
  --wetland-hues-3: #E0E5C0;
  --wetland-hues-4: #75864C;
  --wetland-hues-5: #AAB97E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "wetland-hues": {
        1: "#8A9A5B",
        2: "#C2CC8B",
        3: "#E0E5C0",
        4: "#75864C",
        5: "#AAB97E",
      }
    }
  }
}

Related searches

earthy green color palettenatural wetland colorsorganic brand identity colorsserene nature inspired palettemuted green yellow scheme

Palette colors

Hex values

Color 1#8A9A5B
·
Color 2#C2CC8B
·
Color 3#E0E5C0
·
Color 4#75864C
·
Color 5#AAB97E
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
2.4:1Fail
1.3:1Fail
1.5:1Fail
2
1.8:1Fail
1.3:1Fail
2.3:1Fail
1.2:1Fail
3
2.4:1Fail
1.3:1Fail
3.1:1AA18
1.6:1Fail
4
1.3:1Fail
2.3:1Fail
3.1:1AA18
1.9:1Fail
5
1.5:1Fail
1.2:1Fail
1.6:1Fail
1.9:1Fail

Similar palettes

More like Wetland Hues

View all earth