Back to palettes

Palette

Misty Moorland Dusk

Soft, muted purples and grays that capture the serene and slightly melancholic atmosphere of a misty moorland at dusk.

darkcalm5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Misty Moorland Dusk 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 Misty Moorland Dusk.

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

Data visualization

#3D2D3D#5E4A5E#8A6E8A#B49AC0#DDCDE7

Palette guide

How to use Misty Moorland Dusk

Overview

The Misty Moorland Dusk palette captures the enigmatic beauty of twilight with its rich, muted purples and deep, grounding grays. Featuring shades like the profound #3D2D3D, the contemplative #8A6E8A, and the ethereal #DDCDE7, this collection is perfect for evoking a sense of mystery, sophistication, and calm. Designers and developers can utilize its unique blend to create luxurious branding, immersive digital experiences, or elegant user interfaces that stand apart. The palette's depth and subtle warmth make it ideal for projects that aim for a premium, artistic, or introspective feel, providing a harmonious and visually intriguing experience.

Best used for

  • Luxury brand identity
  • Art and photography portfolios
  • Spiritual or wellness applications
  • High-end fashion websites
  • Night mode UI themes
  • Event branding for elegant occasions

Suggested color roles

primary

#5E4A5E - A rich, medium-dark purple-grey, excellent for main navigation, key headings, or prominent call-to-action buttons, offering depth and elegance.

secondary

#8A6E8A - A balanced, muted lavender, suitable for subheadings, secondary interactive elements, or graphic accents, providing a soft lift.

accent

#B49AC0 - A lighter, serene lilac that can draw attention to interactive states, small icons, or subtle highlights, adding a touch of ethereal glow.

background

#DDCDE7 - A very light, soft lavender-grey, ideal for clean main backgrounds, large content areas, or gentle overlays, creating an airy, sophisticated base.

text

#3D2D3D - A deep, dark purple-grey. Use this for primary body text to ensure excellent readability against lighter backgrounds like #DDCDE7 or #B49AC0.

Accessibility notes

  • Ensure sufficient contrast when pairing the darkest color #3D2D3D with the lightest #DDCDE7 for text.
  • Avoid using #8A6E8A or #B49AC0 for small text on backgrounds of similar lightness to prevent readability issues.
  • For interactive elements, ensure hover/focus states provide clear visual distinction beyond just color change.
  • Test purple-dominant palettes with colorblind users, particularly those with tritanomaly, as subtle purple shifts can be difficult to discern.

Recommended combinations

Twilight Gradient

Perfect for creating deep, atmospheric gradients in hero sections, dark mode interfaces, or sophisticated background textures.

#3D2D3D · #5E4A5E · #8A6E8A

Ethereal Glow

Excellent for highlighting delicate UI elements, soft overlay effects, or for creating a light, inviting content area with subtle depth.

#B49AC0 · #DDCDE7 · #5E4A5E

Mystic Contrast

Ideal for clean typography and clear hierarchy, using the lightest for background, darkest for text, and mid-tone for accents or links.

#DDCDE7 · #3D2D3D · #8A6E8A

CSS variables

:root {
  --misty-moorland-dusk-1: #3D2D3D;
  --misty-moorland-dusk-2: #5E4A5E;
  --misty-moorland-dusk-3: #8A6E8A;
  --misty-moorland-dusk-4: #B49AC0;
  --misty-moorland-dusk-5: #DDCDE7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "misty-moorland-dusk": {
        1: "#3D2D3D",
        2: "#5E4A5E",
        3: "#8A6E8A",
        4: "#B49AC0",
        5: "#DDCDE7",
      }
    }
  }
}

Related searches

dark purple grey palettemysterious color scheme UIsophisticated muted purplestwilight web design colorselegant branding palette purple

Palette colors

Hex values

Color 1#3D2D3D
·
Color 2#5E4A5E
·
Color 3#8A6E8A
·
Color 4#B49AC0
·
Color 5#DDCDE7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.9:1Fail
5.1:1AA
8.5:1AAA
2
1.6:1Fail
1.8:1Fail
3.2:1AA18
5.3:1AA
3
2.9:1Fail
1.8:1Fail
1.8:1Fail
3:1Fail
4
5.1:1AA
3.2:1AA18
1.8:1Fail
1.7:1Fail
5
8.5:1AAA
5.3:1AA
3:1Fail
1.7:1Fail

Similar palettes

More like Misty Moorland Dusk

View all dark
Ancient Fern Whisper
Autumn Dewdrop
Celestial Dream Dust
Cosmic Dust Trail
Midnight Indigo Reverie
Whispering Forest Haze