Back to palettes

Palette

Midnight Elder Woods

Deep, atmospheric blues and greys, like an ancient forest shrouded in the enigma of a moonless night.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Elder Woods 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 Midnight Elder Woods.

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

Data visualization

#1A212E#2E3E50#4A637C#6D8CAB#9ABDCF

Palette guide

How to use Midnight Elder Woods

Overview

The Midnight Elder Woods palette captures the serene yet mysterious ambiance of an ancient forest under a moonless night. It features a range of deep, atmospheric blues and greys, starting with the profound #1A212E and progressing through the rich #2E3E50. The palette then lightens to the contemplative #4A637C and the sophisticated #6D8CAB, culminating in the soft, ethereal #9ABDCF. This collection is perfect for designers and developers seeking to evoke a sense of calm, depth, and natural mystery. It's ideal for creating elegant user interfaces, immersive digital landscapes, or branding that speaks to tranquility, wisdom, and understated sophistication.

Best used for

  • Nature-inspired branding and websites
  • Luxury interior design visualization
  • Calming meditation apps
  • Environmental documentary aesthetics
  • E-commerce for artisanal or handmade goods
  • Dark mode UI themes with a natural feel

Suggested color roles

primary

Use #1A212E as the foundational dark background, establishing a deep, enveloping atmosphere reminiscent of a night forest.

secondary

Apply #2E3E50 for secondary content blocks, cards, or navigation elements, offering subtle contrast and depth.

accent

Reserve #9ABDCF for key interactive elements, important notifications, or subtle highlights to draw attention with a soft glow.

background

The deep #1A212E serves as an excellent primary background, providing a serene and mysterious canvas for content.

text

For optimal readability, use #9ABDCF or #6D8CAB for primary text on darker backgrounds, ensuring clear contrast.

Accessibility notes

  • Ensure high contrast for text, especially when using lighter shades like #9ABDCF on #1A212E or #2E3E50 backgrounds, to meet WCAG AA.
  • Avoid pairing #4A637C with #2E3E50 for small text; choose a lighter shade for improved legibility.
  • Interactive elements should clearly stand out using #9ABDCF against darker backgrounds to aid users with visual impairments.
  • Offer a high-contrast text option (e.g., pure white) for users who require enhanced readability on very dark surfaces.

Recommended combinations

Forest Depths

Ideal for main layouts, using the darkest shades for structure and #9ABDCF for prominent headings or navigation.

#1A212E · #2E3E50 · #9ABDCF

Misty Path

Great for subtle background gradients or section dividers, creating a smooth, atmospheric transition.

#2E3E50 · #4A637C · #6D8CAB

Moonlit Focus

Perfect for UI components: #1A212E as a container, #4A637C for secondary text, and #9ABDCF for active states or icons.

#1A212E · #4A637C · #9ABDCF

CSS variables

:root {
  --midnight-elder-woods-1: #1A212E;
  --midnight-elder-woods-2: #2E3E50;
  --midnight-elder-woods-3: #4A637C;
  --midnight-elder-woods-4: #6D8CAB;
  --midnight-elder-woods-5: #9ABDCF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-elder-woods": {
        1: "#1A212E",
        2: "#2E3E50",
        3: "#4A637C",
        4: "#6D8CAB",
        5: "#9ABDCF",
      }
    }
  }
}

Related searches

dark forest color palettemysterious blue greynature inspired dark themecalm blue grey colorselder woods aesthetic

Palette colors

Hex values

Color 1#1A212E
·
Color 2#2E3E50
·
Color 3#4A637C
·
Color 4#6D8CAB
·
Color 5#9ABDCF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.6:1Fail
4.6:1AA
8.1:1AAA
2
1.5:1Fail
1.8:1Fail
3.1:1AA18
5.5:1AA
3
2.6:1Fail
1.8:1Fail
1.8:1Fail
3.1:1AA18
4
4.6:1AA
3.1:1AA18
1.8:1Fail
1.8:1Fail
5
8.1:1AAA
5.5:1AA
3.1:1AA18
1.8:1Fail

Similar palettes

More like Midnight Elder Woods

View all dark
Bioluminescent Deep Trench
Cosmic Abyss Echo
Dark Forest Undergrowth
Deep Ocean Caverns
Deep Sea Explorer
Ocean Trench Secrets