Back to palettes

Palette

Forest Shroud

Deep, muted greens that create a sense of mystery and depth, like a dense, ancient forest at dusk.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2C3E2D#4B6F4F#7DA381#213022#3A5C3D

Palette guide

How to use Forest Shroud

Overview

The Forest Shroud palette offers a deep, mysterious journey into muted greens, perfect for evoking a sense of ancient woodlands or hidden depths. With its core shades like the profound #213022 and the rich #2C3E2D, this collection provides a sophisticated, somber foundation. The lighter, yet still subdued #7DA381 introduces a touch of filtered light, while #4B6F4F and #3A5C3D maintain the earthy, organic feel. Designers and developers can leverage this palette to create immersive, contemplative digital experiences or branding that conveys gravitas and natural elegance. It’s ideal for projects requiring a mature, understated aesthetic that whispers rather than shouts.

Best used for

  • Luxury eco-friendly branding
  • Dark mode UI designs
  • Nature documentary graphics
  • Mystical themed game environments
  • High-end men's fashion websites
  • Editorial design for conservation topics

Suggested color roles

primary

#2C3E2D (Deep Forest Green) - Use as the dominant brand color or main background for a sophisticated, immersive feel.

secondary

#4B6F4F (Mossy Green) - Excellent for secondary sections, large text blocks, or graphical elements, offering a slightly lighter contrast.

accent

#7DA381 (Pale Moss) - A gentle highlight for interactive elements, icons, or subtle decorative details, bringing a whisper of light.

background

#213022 (Deepest Shroud) - Ideal for dark mode backgrounds, large hero sections, or a canvas that makes other elements recede into depth.

text

#3A5C3D (Dark Emerald) - Suitable for body text on lighter backgrounds like #7DA381, or use a near-white text on the darker shades for readability.

Accessibility notes

  • Ensure sufficient contrast when pairing #7DA381 with lighter text; consider a dark grey or charcoal.
  • The dark background #213022 requires very light text (e.g., #7DA381 or white) for WCAG AA compliance.
  • Avoid using #2C3E2D for small text on #4B6F4F, as contrast might be insufficient.
  • For interactive elements, ensure focus states use a color with strong contrast against both normal and hover states.

Recommended combinations

Deep Forest

Perfect for a strong, cohesive dark theme, creating depth and a sense of enclosure.

#213022 · #2C3E2D · #4B6F4F

Muted Contrast

Balances deep tones with a subtle highlight, suitable for content sections with clear hierarchy.

#2C3E2D · #7DA381 · #3A5C3D

Shrouded Light

Provides a striking contrast for headers or key information against a very dark background.

#213022 · #7DA381 · #4B6F4F

CSS variables

:root {
  --forest-shroud-1: #2C3E2D;
  --forest-shroud-2: #4B6F4F;
  --forest-shroud-3: #7DA381;
  --forest-shroud-4: #213022;
  --forest-shroud-5: #3A5C3D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "forest-shroud": {
        1: "#2C3E2D",
        2: "#4B6F4F",
        3: "#7DA381",
        4: "#213022",
        5: "#3A5C3D",
      }
    }
  }
}

Related searches

dark green color palettemysterious nature colorsdeep forest brand identitymuted green ui themeearthy green hex codes

Palette colors

Hex values

Color 1#2C3E2D
·
Color 2#4B6F4F
·
Color 3#7DA381
·
Color 4#213022
·
Color 5#3A5C3D
·

Accessibility

Contrast checker

1
2
3
4
5
1
2:1Fail
4.1:1AA18
1.2:1Fail
1.5:1Fail
2
2:1Fail
2:1Fail
2.4:1Fail
1.3:1Fail
3
4.1:1AA18
2:1Fail
4.9:1AA
2.7:1Fail
4
1.2:1Fail
2.4:1Fail
4.9:1AA
1.8:1Fail
5
1.5:1Fail
1.3:1Fail
2.7:1Fail
1.8:1Fail

Similar palettes

More like Forest Shroud

View all dark