Back to palettes

Palette

Shaded Mystic Wood

Deep greens and muted earth tones create an aura of ancient, shadowed forest mysticism.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Shaded Mystic Wood 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 Shaded Mystic Wood.

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

Data visualization

#2F4F4F#556B2F#4B3F2A#8FBC8F#36454F

Palette guide

How to use Shaded Mystic Wood

Overview

The "Shaded Mystic Wood" palette conjures the deep, enigmatic atmosphere of an ancient, shadowed forest. It masterfully blends dark, subdued greens and browns, including a sophisticated dark slate gray #2F4F4F, a rich olive green #556B2F, and a deep, earthy brown #4B3F2A. These profound tones are contrasted by a lighter, ethereal sea green #8FBC8F, which introduces a touch of mystery and light. Another dark charcoal #36454F reinforces the palette's depth. This collection is ideal for designs aiming for a mysterious, elegant, and nature-inspired aesthetic.

Best used for

  • Dark mode UI designs
  • Fantasy game environments or concept art
  • Sophisticated nature-themed branding
  • Apparel for outdoor or gothic styles
  • Book covers for mystery or fantasy novels
  • Elegant website backgrounds

Suggested color roles

primary

#2F4F4F (dark slate gray). A deep, grounding color, excellent for backgrounds or primary structural elements in dark themes.

secondary

#4B3F2A (deep earthy brown). Use for content blocks, navigation, or to add warmth within the dark scheme.

accent

#8FBC8F (ethereal sea green). A lighter, contrasting hue perfect for interactive elements, highlights, or subtle decorative details.

background

#36454F (dark charcoal). Provides a solid, mysterious base that allows the other colors to emerge subtly.

text

#8FBC8F offers excellent contrast for headings and important information on darker backgrounds; use a near-white for body text.

Accessibility notes

  • Ensure #8FBC8F provides sufficient contrast for text on #2F4F4F, #556B2F, #4B3F2A, and #36454F.
  • Avoid using #556B2F or #4B3F2A for body text on the darker background colors due to low contrast.
  • For general body text, a light gray or off-white would be necessary to meet readability standards.
  • Interactive elements using #8FBC8F should have clear hover/focus states to guide users.

Recommended combinations

Deep Forest

Ideal for creating immersive, dark backgrounds and content areas in digital interfaces.

#2F4F4F · #556B2F · #4B3F2A

Mysterious Glow

Effective for highlighting key information or interactive elements against a deep backdrop.

#36454F · #8FBC8F · #2F4F4F

Earthy Depths

Excellent for textural elements or subtle branding that evokes natural mystery.

#4B3F2A · #556B2F · #8FBC8F

CSS variables

:root {
  --shaded-mystic-wood-1: #2F4F4F;
  --shaded-mystic-wood-2: #556B2F;
  --shaded-mystic-wood-3: #4B3F2A;
  --shaded-mystic-wood-4: #8FBC8F;
  --shaded-mystic-wood-5: #36454F;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "shaded-mystic-wood": {
        1: "#2F4F4F",
        2: "#556B2F",
        3: "#4B3F2A",
        4: "#8FBC8F",
        5: "#36454F",
      }
    }
  }
}

Related searches

dark forest color palettemystic green brown schemedeep nature colorsshadowy wood designsophisticated dark palette

Palette colors

Hex values

Color 1#2F4F4F
·
Color 2#556B2F
·
Color 3#4B3F2A
·
Color 4#8FBC8F
·
Color 5#36454F
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
1.2:1Fail
4.1:1AA18
1.1:1Fail
2
1.5:1Fail
1.7:1Fail
2.8:1Fail
1.7:1Fail
3
1.2:1Fail
1.7:1Fail
4.8:1AA
1:1Fail
4
4.1:1AA18
2.8:1Fail
4.8:1AA
4.6:1AA
5
1.1:1Fail
1.7:1Fail
1:1Fail
4.6:1AA

Similar palettes

More like Shaded Mystic Wood

View all dark
Enchanted Evergreen Depth
Mystic Forest Shroud
Mystic Woods Bloom
Verdant Canopy Depths
Dark Forest Canopy
Dark Forest Lore