Back to palettes

Palette

Midnight Star Dust

A profound palette capturing the vastness of space adorned with shimmering cosmic dust.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Star Dust 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 Star Dust.

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

Data visualization

#0B0E2A#2F1E6F#6A44A4#AD7BEF#E7D7FA

Palette guide

How to use Midnight Star Dust

Overview

This "Midnight Star Dust" palette plunges into the mystical and vibrant depths of a cosmic galaxy, featuring a rich spectrum of deep purples and luminous lavenders. It anchors with an intense, almost black indigo (#0B0E2A), transitioning through a profound dark violet (#2F1E6F). A captivating medium purple (#6A44A4) provides a vibrant core, while a brilliant light purple (#AD7BEF) and an ethereal pale lavender (#E7D7FA) mimic shimmering nebulae and distant starlight. This palette is perfect for designers and developers seeking to convey magic, wonder, and a sense of otherworldly beauty, ideal for creative, mystical, or futuristic projects.

Best used for

  • Fantasy or sci-fi game interfaces
  • Mystical and spiritual brand identities
  • Creative digital art and illustrations
  • Event branding for cosmic-themed parties
  • Fashion design with an ethereal quality
  • Web design for artists or designers

Suggested color roles

primary

#0B0E2A serves as the deep, mysterious background, setting a cosmic and magical tone.

secondary

#2F1E6F is excellent for sub-sections, navigation, or larger text blocks, deepening the galactic feel.

accent

#AD7BEF is the radiant starburst, perfect for call-to-action buttons, key highlights, or glowing effects that demand attention.

background

#E7D7FA provides a very light, ethereal canvas for content, ensuring readability while maintaining the palette's dreamy quality.

text

For dark backgrounds like #0B0E2A, use #E7D7FA or white. For light backgrounds like #E7D7FA, use #0B0E2A or a deep eggplant for optimal readability.

Accessibility notes

  • Ensure #0B0E2A text on #E7D7FA background meets WCAG AA or AAA contrast.
  • #2F1E6F provides good contrast for body text on #E7D7FA.
  • Be cautious using #AD7BEF for small text on #E7D7FA; contrast might be too low.
  • The accent color #AD7BEF needs careful contrast checking, especially if used for text on light backgrounds.

Recommended combinations

Galactic Nebula

Creates a dramatic and vibrant dark mode interface, perfect for immersive digital experiences.

#0B0E2A · #2F1E6F · #AD7BEF

Cosmic Shimmer

Ideal for creating subtle gradients or layered effects in UI elements, evoking a soft, magical luminosity.

#2F1E6F · #6A44A4 · #E7D7FA

Starlight Portal

Effective for hero sections or landing pages where a deep background dramatically contrasts with bright, ethereal accents.

#0B0E2A · #E7D7FA · #AD7BEF

CSS variables

:root {
  --midnight-star-dust-4-1: #0B0E2A;
  --midnight-star-dust-4-2: #2F1E6F;
  --midnight-star-dust-4-3: #6A44A4;
  --midnight-star-dust-4-4: #AD7BEF;
  --midnight-star-dust-4-5: #E7D7FA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-star-dust-4": {
        1: "#0B0E2A",
        2: "#2F1E6F",
        3: "#6A44A4",
        4: "#AD7BEF",
        5: "#E7D7FA",
      }
    }
  }
}

Related searches

dark purple galaxy palettemystical cosmic colorsvibrant space theme UIdeep violet aestheticethereal night sky colors

Palette colors

Hex values

Color 1#0B0E2A
·
Color 2#2F1E6F
·
Color 3#6A44A4
·
Color 4#AD7BEF
·
Color 5#E7D7FA
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.7:1Fail
6.2:1AA
14:1AAA
2
1.4:1Fail
1.9:1Fail
4.5:1AA18
10.1:1AAA
3
2.7:1Fail
1.9:1Fail
2.3:1Fail
5.2:1AA
4
6.2:1AA
4.5:1AA18
2.3:1Fail
2.3:1Fail
5
14:1AAA
10.1:1AAA
5.2:1AA
2.3:1Fail

Similar palettes

More like Midnight Star Dust

View all dark