Back to palettes

Palette

Cosmic Dust Glow

A deep and shimmering palette of purples, reminiscent of glowing dust clouds in deep space.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#483D8B#6A5ACD#8A2BE2#BA55D3#DDA0DD

Palette guide

How to use Cosmic Dust Glow

Overview

The Cosmic Dust Glow palette offers a vibrant spectrum of purples, reminiscent of glowing nebulae and distant stardust, perfect for projects requiring a mystical and energetic touch. Ranging from the deep indigo of #483D8B to the soft lavender of #DDA0DD, this palette provides a rich foundation for designers. It's particularly effective for creating captivating digital art, dynamic branding, or engaging user interfaces that need to stand out. Developers can integrate these striking hex codes, such as the electric #8A2BE2, to build visually rich applications and websites, ensuring a consistent and enchanting user experience across various platforms.

Best used for

  • Fantasy game interfaces
  • Mystical digital illustrations
  • Vibrant event branding
  • Creative art portfolios
  • Cosmetic or luxury product packaging
  • Dynamic website headers

Suggested color roles

primary

#483D8B - A strong, deep purple that serves as an excellent base for large sections or main content areas.

secondary

#6A5ACD - A slightly lighter, more vibrant purple, suitable for supporting elements, secondary buttons, or data visualization.

accent

#BA55D3 - A bright, shimmering purple that draws attention, ideal for calls to action, highlights, or interactive states.

background

#483D8B - The deepest, most foundational color, perfect for immersive dark backgrounds that allow lighter elements to glow.

text

#DDA0DD or white - Provides excellent contrast on darker shades, enhancing readability for headings and body text.

Accessibility notes

  • Ensure sufficient contrast when pairing #6A5ACD with #8A2BE2 for text or interactive elements.
  • Use #DDA0DD or white for text on darker backgrounds like #483D8B to meet WCAG AA guidelines.
  • Be mindful of contrast when using #BA55D3 for smaller text against #6A5ACD.
  • Test all color combinations, especially for critical UI components, to ensure readability for all users.

Recommended combinations

Nebula Gradient

Creates a smooth, ethereal transition for backgrounds or atmospheric visual elements.

#483D8B · #6A5ACD · #8A2BE2

Highlight & Depth

Effectively pairs a deep base with bright accents for calls to action or key information.

#483D8B · #BA55D3 · #DDA0DD

Cosmic Layers

Ideal for layered UI components, separating information while maintaining a cohesive look.

#6A5ACD · #8A2BE2 · #DDA0DD

CSS variables

:root {
  --cosmic-dust-glow-1: #483D8B;
  --cosmic-dust-glow-2: #6A5ACD;
  --cosmic-dust-glow-3: #8A2BE2;
  --cosmic-dust-glow-4: #BA55D3;
  --cosmic-dust-glow-5: #DDA0DD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cosmic-dust-glow": {
        1: "#483D8B",
        2: "#6A5ACD",
        3: "#8A2BE2",
        4: "#BA55D3",
        5: "#DDA0DD",
      }
    }
  }
}

Related searches

glowing purple palettemystical space colorsvibrant cosmic designdeep lavender hex codesfantasy UI color scheme

Palette colors

Hex values

Color 1#483D8B
·
Color 2#6A5ACD
·
Color 3#8A2BE2
·
Color 4#BA55D3
·
Color 5#DDA0DD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
1.5:1Fail
2.3:1Fail
4.4:1AA18
2
1.7:1Fail
1.1:1Fail
1.3:1Fail
2.6:1Fail
3
1.5:1Fail
1.1:1Fail
1.5:1Fail
2.9:1Fail
4
2.3:1Fail
1.3:1Fail
1.5:1Fail
1.9:1Fail
5
4.4:1AA18
2.6:1Fail
2.9:1Fail
1.9:1Fail

Similar palettes

More like Cosmic Dust Glow

View all dark