Back to palettes

Palette

Cosmic Dream Dust

Deep purples and blues blend with shimmering starlight, capturing the magic of cosmic dust.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cosmic Dream 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 Cosmic Dream Dust.

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

Data visualization

#0B0E14#2A1F3C#5C3A7A#8F6BC1#C7A2E8

Palette guide

How to use Cosmic Dream Dust

Overview

The Cosmic Dream Dust palette blends deep purples and blues with shimmering starlight, capturing the magic of cosmic dust. Featuring shades like the profound #0B0E14, the rich #2A1F3C, and the ethereal #C7A2E8, this collection offers a dark, mystical, and deeply engaging aesthetic. Designers can leverage the strong contrast between the deep base colors and the luminous lighter tones to create striking visual hierarchies. Developers will find these hex codes ideal for crafting immersive digital experiences, from sophisticated dark mode interfaces to evocative website themes, ensuring a visually rich and engaging user journey that conveys depth and cosmic wonder across various digital platforms.

Best used for

  • Luxury dark mode UI/UX design
  • Mystical or fantasy game interfaces
  • High-end event or brand identity
  • Digital art with deep space themes
  • E-commerce for unique artisanal products
  • Fashion editorial layouts with an elegant, dark edge

Suggested color roles

primary

Designate #0B0E14 as a profound primary, ideal for main backgrounds, commanding headers, or foundational brand elements.

secondary

Utilize #2A1F3C as a rich secondary, excellent for subheadings, navigation, or larger background sections to add depth.

accent

Apply #8F6BC1 as a vibrant accent, perfect for interactive elements, icons, or highlights that need to draw attention.

background

The deep #0B0E14 provides an immersive dark canvas. Alternatively, #C7A2E8 can serve as a delicate, ethereal background.

text

White or a very light gray provides excellent contrast on #0B0E14, #2A1F3C, and #5C3A7A. Use #0B0E14 for text on #C7A2E8.

Accessibility notes

  • Ensure white text on #0B0E14, #2A1F3C, and #5C3A7A meets WCAG AA contrast standards for readability.
  • Avoid pairing #8F6BC1 and #C7A2E8 for small text due to their close values and potential low contrast; reserve for larger graphics.
  • The lighter shade #C7A2E8 works well for subtle glow effects or as a background for darker text.
  • For body text on #C7A2E8, consider using #0B0E14 or #2A1F3C for better legibility than a standard black.

Recommended combinations

Deep Stardust

Combine the deepest shades for a profound background with the lightest for striking text or key UI elements.

#0B0E14 · #2A1F3C · #C7A2E8

Dreamy Nebula

Create smooth gradients or layered effects in UI design, mimicking the atmospheric transition of cosmic dust.

#2A1F3C · #5C3A7A · #8F6BC1

Mystic Contrast

Use #C7A2E8 as a light background, #0B0E14 for primary text, and #5C3A7A for secondary information or interactive elements.

#C7A2E8 · #0B0E14 · #5C3A7A

CSS variables

:root {
  --cosmic-dream-dust-1: #0B0E14;
  --cosmic-dream-dust-2: #2A1F3C;
  --cosmic-dream-dust-3: #5C3A7A;
  --cosmic-dream-dust-4: #8F6BC1;
  --cosmic-dream-dust-5: #C7A2E8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-dream-dust": {
        1: "#0B0E14",
        2: "#2A1F3C",
        3: "#5C3A7A",
        4: "#8F6BC1",
        5: "#C7A2E8",
      }
    }
  }
}

Related searches

deep purple blue palettemystical cosmic dust colorsdark dream space schemeglowing purple UI colorselegant dark mode branding

Palette colors

Hex values

Color 1#0B0E14
·
Color 2#2A1F3C
·
Color 3#5C3A7A
·
Color 4#8F6BC1
·
Color 5#C7A2E8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2.2:1Fail
4.6:1AA
9:1AAA
2
1.3:1Fail
1.7:1Fail
3.7:1AA18
7.2:1AAA
3
2.2:1Fail
1.7:1Fail
2.2:1Fail
4.2:1AA18
4
4.6:1AA
3.7:1AA18
2.2:1Fail
1.9:1Fail
5
9:1AAA
7.2:1AAA
4.2:1AA18
1.9:1Fail

Similar palettes

More like Cosmic Dream Dust

View all dark
Celestial Lanterns
Cosmic Drift Dust
Galactic Void Shimmer
Nebula Glimmer Dream
Violet Stardust Swirl
Celestial Glimmer Dust