Back to palettes

Palette

Dark Forest Undergrowth

Deep, shadowed greens and blues that evoke the hidden, mysterious beauty of a forest's undergrowth.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1E342F#3A5E53#5A7F73#2B3D4A#4C6F8E

Palette guide

How to use Dark Forest Undergrowth

Overview

The Dark Forest Undergrowth palette intricately weaves deep, shadowed greens with muted blues, capturing the hidden, mysterious beauty found beneath a dense forest canopy. This unique combination, featuring shades like #1E342F, #3A5E53, and the contrasting #2B3D4A, provides a sophisticated and intriguing aesthetic. It's ideal for designs that seek to convey depth, natural mystery, and a touch of the unexpected. Designers can leverage these colors for immersive backgrounds or to create compelling visual narratives for environmental projects, while developers will find them perfect for dark mode interfaces needing an organic yet distinct feel.

Best used for

  • Environmental conservation websites
  • Mystery novel cover designs
  • Nature documentary branding
  • Dark mode UI for educational science apps
  • Outdoor exploration gear marketing
  • Botanical illustration platforms

Suggested color roles

primary

#1E342F - A deep, muted forest green that provides a strong, grounding primary color for large content blocks, headers, or brand identity.

secondary

#2B3D4A - This deep, muted blue offers a compelling contrast, ideal for secondary navigation, feature panels, or to introduce a subtle shift in mood.

accent

#5A7F73 - A lighter, serene green-teal, perfect for subtle highlights, interactive elements, or delicate graphical details that need to stand out.

background

#1E342F - This deep forest green doubles as an excellent immersive background, setting a mysterious and sophisticated tone.

text

#4C6F8E - A legible, muted blue that works well for subheadings or emphasized text. For main body text on darker backgrounds, consider a very light gray (e.g., #F0F0F0) for optimal readability.

Accessibility notes

  • Ensure sufficient contrast when using #5A7F73 for text on darker background colors like #1E342F or #2B3D4A.
  • Avoid placing #4C6F8E text on similar mid-tones without careful contrast checking.
  • For critical text on the darkest backgrounds, opt for a pure white or very light gray to meet accessibility standards.
  • Test all color pairings for sufficient contrast, particularly for interactive elements and crucial information.

Recommended combinations

Deep Contrast

Pairing the deepest green and blue for backgrounds, with the lighter blue for prominent text or icons.

#1E342F · #2B3D4A · #4C6F8E

Undergrowth Glow

Using mid-greens as primary/secondary with the lightest green for subtle highlights, against a dark base.

#3A5E53 · #5A7F73 · #1E342F

Shaded Harmony

Combining the blues with a mid-green for a balanced, cool-toned content block or dashboard.

#2B3D4A · #4C6F8E · #3A5E53

CSS variables

:root {
  --dark-forest-undergrowth-1: #1E342F;
  --dark-forest-undergrowth-2: #3A5E53;
  --dark-forest-undergrowth-3: #5A7F73;
  --dark-forest-undergrowth-4: #2B3D4A;
  --dark-forest-undergrowth-5: #4C6F8E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "dark-forest-undergrowth": {
        1: "#1E342F",
        2: "#3A5E53",
        3: "#5A7F73",
        4: "#2B3D4A",
        5: "#4C6F8E",
      }
    }
  }
}

Related searches

deep green blue palettemysterious forest colorsdark teal blue schemenature undergrowth huesmuted forest UI

Palette colors

Hex values

Color 1#1E342F
·
Color 2#3A5E53
·
Color 3#5A7F73
·
Color 4#2B3D4A
·
Color 5#4C6F8E
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
3:1Fail
1.2:1Fail
2.5:1Fail
2
1.8:1Fail
1.6:1Fail
1.6:1Fail
1.4:1Fail
3
3:1Fail
1.6:1Fail
2.5:1Fail
1.2:1Fail
4
1.2:1Fail
1.6:1Fail
2.5:1Fail
2.1:1Fail
5
2.5:1Fail
1.4:1Fail
1.2:1Fail
2.1:1Fail

Similar palettes

More like Dark Forest Undergrowth

View all dark