Back to palettes

Palette

Forest Fern

A spectrum of natural greens, from deep moss to vibrant new growth, found in a serene fern glade.

monochromenatural5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Forest Fern 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 Forest Fern.

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

Data visualization

#2E472D#4B6B4A#749B73#A1C9A0#D0E8CF

Palette guide

How to use Forest Fern

Overview

The Forest Fern palette captures the full spectrum of natural greens found in a serene fern glade, from deep moss to vibrant new growth. This monochrome collection, anchored by the rich #2E472D and extending to the airy #D0E8CF, offers designers and developers a versatile range for creating organic and refreshing visuals. The mid-tones, #4B6B4A and #749B73, provide excellent options for layering and depth, while #A1C9A0 adds a touch of brightness. This palette is perfect for projects aiming to evoke freshness, environmental consciousness, or a natural, earthy feel. Its inherent harmony ensures a cohesive and visually pleasing user experience across diverse applications.

Best used for

  • Environmental organization websites
  • Gardening and landscaping services branding
  • Outdoor adventure gear advertisements
  • Sustainable product packaging
  • Health food store interiors
  • Children's nature education apps

Suggested color roles

primary

#2E472D - A deep, foundational green, excellent for headers, footers, or primary brand identity, conveying stability.

secondary

#4B6B4A - Ideal for sub-sections, background elements, or larger blocks of content, providing a softer presence.

accent

#749B73 - Use for calls to action, interactive elements, or graphic highlights to add a natural, engaging pop.

background

#D0E8CF - A very light and breathable background, perfect for ensuring text readability and an open feel.

text

#2E472D - Provides excellent contrast and readability on lighter backgrounds like #D0E8CF, suitable for main body text.

Accessibility notes

  • Ensure #2E472D text on #D0E8CF background meets WCAG AA contrast for comfortable reading.
  • Avoid using #A1C9A0 for small text on #749B73 as the contrast might be insufficient for accessibility.
  • For text over darker colors like #2E472D, use a very light color, such as white or #D0E8CF, to ensure visibility.
  • Use clear focus indicators for interactive elements that are distinct from their normal state.

Recommended combinations

Deep Glade

Creates a rich, layered forest depth, suitable for immersive backgrounds or feature sections.

#2E472D · #4B6B4A · #749B73

Fresh Growth

A light and airy combination for main content areas, excellent for clean user interfaces.

#D0E8CF · #A1C9A0 · #4B6B4A

Vibrant Accent

Use a dark base with a fresh mid-tone accent, ideal for highlighting key information or navigation.

#2E472D · #749B73 · #D0E8CF

CSS variables

:root {
  --forest-fern-1: #2E472D;
  --forest-fern-2: #4B6B4A;
  --forest-fern-3: #749B73;
  --forest-fern-4: #A1C9A0;
  --forest-fern-5: #D0E8CF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "forest-fern": {
        1: "#2E472D",
        2: "#4B6B4A",
        3: "#749B73",
        4: "#A1C9A0",
        5: "#D0E8CF",
      }
    }
  }
}

Related searches

natural green color schemeforest inspired brandingearthy green UI palettemonochromatic nature colorsfresh woodland design

Palette colors

Hex values

Color 1#2E472D
·
Color 2#4B6B4A
·
Color 3#749B73
·
Color 4#A1C9A0
·
Color 5#D0E8CF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
3.2:1AA18
5.5:1AA
7.8:1AAA
2
1.7:1Fail
1.9:1Fail
3.2:1AA18
4.6:1AA
3
3.2:1AA18
1.9:1Fail
1.7:1Fail
2.4:1Fail
4
5.5:1AA
3.2:1AA18
1.7:1Fail
1.4:1Fail
5
7.8:1AAA
4.6:1AA
2.4:1Fail
1.4:1Fail

Similar palettes

More like Forest Fern

View all monochrome
Emerald Canopy Sun
Forest Canopy Verdant
Verdant Canopy Shade
Ancient Temple Moss
Emerald Glade
Green Moss Harmony