Back to palettes

Palette

Emerald Coast Moss

Deep, rich greens and cool, damp grays capture the lush, ancient beauty of an emerald coastal landscape.

earthnatural5 colors
More earth palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Emerald Coast 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 Emerald Coast Moss.

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

Data visualization

#0F3B2C#2E5A48#4D7A6D#7CA89A#A3C7B6

Palette guide

How to use Emerald Coast Moss

Overview

The Emerald Coast Moss palette captures the lush, ancient beauty of a damp, verdant coastal landscape. It features a deep, earthy #0F3B2C, the rich #2E5A48, and the balanced #4D7A6D, gradually lightening to the tranquil #7CA89A and the soft #A3C7B6. This palette is inherently natural and calming, perfect for designs that evoke a sense of organic tranquility, heritage, and deep connection to nature. It's an excellent choice for sustainable brands, outdoor lifestyle applications, or digital interfaces seeking a grounded, earthy, and sophisticated aesthetic with an emphasis on serene, mossy greens.

Best used for

  • Sustainable and eco-conscious branding
  • Outdoor apparel and adventure websites
  • Nature photography portfolios
  • Wellness and mindfulness apps
  • Interior design for natural, calming spaces
  • Digital art with forest or coastal themes

Suggested color roles

primary

Use #0F3B2C for dominant elements, headers, or backgrounds to establish a strong, earthy, and profound foundation.

secondary

Employ #2E5A48 or #4D7A6D for supporting graphics, subheadings, or interactive elements, adding rich texture.

accent

Apply #A3C7B6 for subtle highlights, delicate patterns, or light interactive elements to introduce softness and freshness.

background

Utilize #A3C7B6 for clean, airy backgrounds that allow the deeper greens to shine while maintaining a natural feel.

text

For body text, use a dark charcoal like #333333. For headlines on lighter backgrounds, #0F3B2C provides excellent readability. Use white for text on #0F3B2C.

Accessibility notes

  • Ensure #0F3B2C or #2E5A48 text on #A3C7B6 meets WCAG contrast standards.
  • Avoid using #A3C7B6 for small text on light backgrounds; it's best for large headlines or accents.
  • The lighter greens #7CA89A and #A3C7B6 may have low contrast when used together; separate them.
  • Pair #0F3B2C with #A3C7B6 for a high-contrast, accessible combination for primary content.

Recommended combinations

Mossy Depths

Ideal for creating a profound, organic feel in branding, website hero sections, or illustrations with natural textures.

#0F3B2C · #2E5A48 · #4D7A6D

Coastal Mist

Perfect for light UI elements, background gradients, or decorative patterns that need to convey freshness and serenity.

#7CA89A · #A3C7B6 · #4D7A6D

Earthy Contrast

Use for impactful call-to-action buttons, key highlights, or sections that require a bold yet naturally inviting visual statement.

#0F3B2C · #A3C7B6 · #7CA89A

CSS variables

:root {
  --emerald-coast-moss-1: #0F3B2C;
  --emerald-coast-moss-2: #2E5A48;
  --emerald-coast-moss-3: #4D7A6D;
  --emerald-coast-moss-4: #7CA89A;
  --emerald-coast-moss-5: #A3C7B6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "emerald-coast-moss": {
        1: "#0F3B2C",
        2: "#2E5A48",
        3: "#4D7A6D",
        4: "#7CA89A",
        5: "#A3C7B6",
      }
    }
  }
}

Related searches

emerald green moss palettenatural coastal colorsearthy green color schemesustainable brand identitycalming nature palette

Palette colors

Hex values

Color 1#0F3B2C
·
Color 2#2E5A48
·
Color 3#4D7A6D
·
Color 4#7CA89A
·
Color 5#A3C7B6
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
4.7:1AA
6.8:1AA
2
1.6:1Fail
1.6:1Fail
3:1Fail
4.3:1AA18
3
2.6:1Fail
1.6:1Fail
1.8:1Fail
2.6:1Fail
4
4.7:1AA
3:1Fail
1.8:1Fail
1.4:1Fail
5
6.8:1AA
4.3:1AA18
2.6:1Fail
1.4:1Fail

Similar palettes

More like Emerald Coast Moss

View all earth