Back to palettes

Palette

Celestial Dust Trail

Deep purples and pinks swirl like distant nebulae, tracing a mystical trail across the cosmos.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Dust Trail 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 Celestial Dust Trail.

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

Data visualization

#1D0A35#4E1B73#8C31B7#B967D8#E0A3F5

Palette guide

How to use Celestial Dust Trail

Overview

The Celestial Dust Trail palette features deep purples and pinks swirling like distant nebulae, tracing a mystical path across the cosmos. Ranging from the profound #1D0A35 to the vibrant #E0A3F5, with harmonious intermediate shades like #4E1B73, #8C31B7, and #B967D8, this collection exudes a dark, elegant, and ethereal aura. It's ideal for designers and developers looking to create immersive, captivating, and sophisticated digital experiences, branding, or interfaces that evoke the vastness and beauty of the cosmos with a touch of mystery.

Best used for

  • Sci-fi and fantasy game interfaces
  • Luxury cosmetic packaging
  • Mystical event promotions
  • Dark mode UI designs
  • Astronomy visualization tools
  • E-commerce for unique, handcrafted items

Suggested color roles

primary

#1D0A35 serves as a dominant, deep background color, establishing a luxurious and mysterious foundation.

secondary

#4E1B73 or #8C31B7 are excellent for secondary sections, navigation, or card backgrounds, adding depth and richness.

accent

#E0A3F5 or #B967D8 provides a luminous highlight for interactive elements, calls to action, or subtle glowing effects.

background

For dark themes, #1D0A35 is the primary background. For lighter sections, #E0A3F5 can serve as a delicate accent background.

text

#E0A3F5 or #B967D8 offers excellent readability against the darker shades. A near-white is also suitable.

Accessibility notes

  • #E0A3F5 provides strong contrast for text on #1D0A35, #4E1B73, and #8C31B7, meeting WCAG AA standards.
  • Be cautious when using #B967D8 for small text on #E0A3F5; ensure sufficient contrast.
  • Ensure interactive elements using lighter shades on darker backgrounds have clear focus states.
  • This palette offers good options for high contrast text pairings, especially with the lightest and darkest shades.

Recommended combinations

Cosmic Mystery

Ideal for a sophisticated dark mode interface with clear hierarchy and a bright accent.

#1D0A35 · #E0A3F5 · #8C31B7

Nebula Layers

Perfect for background fills or hero sections, creating a smooth, ethereal gradient.

#4E1B73 · #8C31B7 · #B967D8

Luminous Path

Use #E0A3F5 as a light background for specific content blocks, with dark text and a deeper accent.

#E0A3F5 · #1D0A35 · #4E1B73

CSS variables

:root {
  --celestial-dust-trail-3-1: #1D0A35;
  --celestial-dust-trail-3-2: #4E1B73;
  --celestial-dust-trail-3-3: #8C31B7;
  --celestial-dust-trail-3-4: #B967D8;
  --celestial-dust-trail-3-5: #E0A3F5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-dust-trail-3": {
        1: "#1D0A35",
        2: "#4E1B73",
        3: "#8C31B7",
        4: "#B967D8",
        5: "#E0A3F5",
      }
    }
  }
}

Related searches

dark purple pink palettecosmic galaxy colorsmystical UI designethereal web brandingdeep nebula theme

Palette colors

Hex values

Color 1#1D0A35
·
Color 2#4E1B73
·
Color 3#8C31B7
·
Color 4#B967D8
·
Color 5#E0A3F5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.8:1Fail
5.2:1AA
9.4:1AAA
2
1.5:1Fail
1.9:1Fail
3.5:1AA18
6.2:1AA
3
2.8:1Fail
1.9:1Fail
1.9:1Fail
3.3:1AA18
4
5.2:1AA
3.5:1AA18
1.9:1Fail
1.8:1Fail
5
9.4:1AAA
6.2:1AA
3.3:1AA18
1.8:1Fail

Similar palettes

More like Celestial Dust Trail

View all dark