Palette

Celestial Shimmer Glow

Deep space purples gradually lightening, evoking a mysterious allure from the cosmos.

darkdark5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Celestial Shimmer 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 Celestial Shimmer Glow.

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

Data visualization

#0C0F2B#2E1A47#5B3F6E#A07CCF#E9C9F9

Palette guide

How to use Celestial Shimmer Glow

Overview

The "Celestial Shimmer Glow" palette captures the mysterious allure of the cosmos with deep space purples gradually lightening to ethereal pinks. It starts with the profound #0C0F2B, transitions through the rich #2E1A47 and #5B3F6E, then brightens with the luminous #A07CCF, culminating in the delicate #E9C9F9. This dark, yet mystical palette is perfect for designs that aim to convey depth, sophistication, and a touch of otherworldly wonder. Developers can create immersive dark mode interfaces, while designers can craft captivating branding or digital art that feels both vast and intimately detailed, evoking the quiet majesty of space.

Best used for

Mystical branding and websites
Dark mode UI/UX designs
Fantasy game environments
Spiritual or contemplative apps
Luxury event invitations
Abstract digital art

Suggested color roles

primary

#0C0F2B - The core deep background, providing an immersive and sophisticated foundation.

secondary

#2E1A47 - Use for secondary panels, card backgrounds, or to define sections in a dark interface.

accent

#E9C9F9 - The lightest shade, perfect for glowing highlights, icons, or to draw attention to key interactive elements.

background

#0C0F2B - The main background, creating a vast, dark, and mysterious cosmic aesthetic.

text

#E9C9F9 - Excellent for primary text on dark backgrounds like #0C0F2B or #2E1A47, ensuring high readability and a clean look.

Accessibility notes

Text in #E9C9F9 on #0C0F2B provides high contrast, ensuring good readability for all text.
Ensure #A07CCF text on #2E1A47 has sufficient contrast for WCAG AA compliance, especially for smaller fonts.
Avoid using #5B3F6E for small or critical text on #2E1A47 as contrast might be borderline.
Use #E9C9F9 for interactive elements to ensure they are easily discoverable against darker shades.

Recommended combinations

Cosmic Depths

Creates a classic dark mode look with bright, readable text and clear hierarchy.

#0C0F2B · #2E1A47 · #E9C9F9

Starlight Gradient

Excellent for smooth, cosmic gradients in backgrounds, headers, or digital art.

#2E1A47 · #5B3F6E · #A07CCF

Ethereal Glow

Use the lighter shades for detailed illustrations or subtle UI highlights against the deep background.

#0C0F2B · #A07CCF · #E9C9F9

CSS variables

:root {
  --celestial-shimmer-glow-1: #0C0F2B;
  --celestial-shimmer-glow-2: #2E1A47;
  --celestial-shimmer-glow-3: #5B3F6E;
  --celestial-shimmer-glow-4: #A07CCF;
  --celestial-shimmer-glow-5: #E9C9F9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-shimmer-glow": {
        1: "#0C0F2B",
        2: "#2E1A47",
        3: "#5B3F6E",
        4: "#A07CCF",
        5: "#E9C9F9",
      }
    }
  }
}

Hex values

Color 1#0C0F2B

Color 2#2E1A47

Color 3#5B3F6E

Color 4#A07CCF

Color 5#E9C9F9

Accessibility

Contrast checker

1.2:1Fail

2.1:1Fail

5.6:1AA

12.7:1AAA

1.2:1Fail

1.8:1Fail

4.6:1AA

10.5:1AAA

2.1:1Fail

1.8:1Fail

2.6:1Fail

6:1AA

5.6:1AA

4.6:1AA

2.6:1Fail

2.3:1Fail

12.7:1AAA

10.5:1AAA

6:1AA

2.3:1Fail

Similar palettes

More like Celestial Shimmer Glow

View all dark

Cosmic Dreamscape Dust