Palette

Starlight Nebula Gaze

Deep purples and starry blues capture the awe-inspiring beauty of a distant cosmic nebula.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Starlight Nebula Gaze 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 Starlight Nebula Gaze.

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

Data visualization

#2C0F4A#4A1E7B#7B4AD5#B08BEB#1E0B36

Palette guide

How to use Starlight Nebula Gaze

Overview

The Starlight Nebula Gaze palette offers a captivating journey into the cosmos, featuring deep purples and vibrant violets. This palette, anchored by the profound #1E0B36 and the rich #2C0F4A, evokes a sense of mystery and cosmic awe. It progresses through the luxurious #4A1E7B to the luminous #7B4AD5 and the soft, ethereal #B08BEB. Designers can utilize this spectrum to create immersive digital experiences, from sophisticated brand identities to engaging interactive platforms. The blend of dark, grounding shades with brighter, shimmering accents provides excellent versatility for establishing visual depth and highlighting key elements. Developers will find these hex codes perfect for crafting elegant interfaces that convey a sense of wonder and refined aesthetics.

Best used for

Mysterious brand identity and logos
Cosmic-themed digital art and illustrations
Gaming interfaces and fantasy world designs
Luxury product landing pages
Astrology or spiritual app designs
Elegant editorial layouts with a dark theme

Suggested color roles

primary

Use #1E0B36 or #2C0F4A as the foundational background for a deep, cosmic canvas, ideal for setting a mysterious and immersive tone.

secondary

Apply #4A1E7B for secondary content areas, navigation elements, or panels, providing a rich, supportive color that complements the darker base.

accent

Leverage #7B4AD5 for call-to-action buttons, interactive highlights, or significant data visualizations, drawing immediate attention with its vibrant glow.

background

The darkest shade, #1E0B36, is excellent for primary backgrounds in a dark UI. For subtle variations or layered effects, #2C0F4A can also serve as a dark background.

text

For text on dark backgrounds like #1E0B36 or #2C0F4A, use #B08BEB or #7B4AD5 to ensure excellent readability. On lighter elements, a dark gray or black is suitable.

Accessibility notes

Ensure sufficient contrast between #B08BEB and darker shades like #1E0B36 or #2C0F4A for all body text.
Check the contrast of #7B4AD5 against #4A1E7B if used for text or small icons to prevent readability issues.
Use #B08BEB for larger headings or key information on #2C0F4A to meet WCAG AAA standards where possible.
Avoid using mid-tones like #4A1E7B as text color on backgrounds that are too close in value, such as #2C0F4A.

Recommended combinations

Deep Cosmic

Perfect for creating layered, dark backgrounds or subtle depth in complex UI components.

#1E0B36 · #2C0F4A · #4A1E7B

Nebula Glow

Ideal for glowing effects, hover states, or highlighting interactive elements against a darker base.

#2C0F4A · #7B4AD5 · #B08BEB

Mystic Harmony

Great for illustrating progression or hierarchy in data visualizations, or for elegant decorative elements.

#4A1E7B · #7B4AD5 · #B08BEB

CSS variables

:root {
  --starlight-nebula-gaze-1: #2C0F4A;
  --starlight-nebula-gaze-2: #4A1E7B;
  --starlight-nebula-gaze-3: #7B4AD5;
  --starlight-nebula-gaze-4: #B08BEB;
  --starlight-nebula-gaze-5: #1E0B36;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "starlight-nebula-gaze": {
        1: "#2C0F4A",
        2: "#4A1E7B",
        3: "#7B4AD5",
        4: "#B08BEB",
        5: "#1E0B36",
      }
    }
  }
}

Hex values

Color 1#2C0F4A

Color 2#4A1E7B

Color 3#7B4AD5

Color 4#B08BEB

Color 5#1E0B36

Accessibility

Contrast checker

1.4:1Fail

3:1Fail

6.1:1AA

1.1:1Fail

1.4:1Fail

2.1:1Fail

4.4:1AA18

1.5:1Fail

3:1Fail

2.1:1Fail

2:1Fail

3.3:1AA18

6.1:1AA

4.4:1AA18

2:1Fail

6.7:1AA

1.1:1Fail

1.5:1Fail

3.3:1AA18

6.7:1AA

Similar palettes

More like Starlight Nebula Gaze

View all dark

Dark Galaxy Nebula

Celestial Lanterns

Celestial Stardust Trails

Cosmic Deep Slumber

Cosmic Drift Dust

Cosmic Dust Whisper