Back to palettes

Palette

Night Sky Lumina

Deep blues transition to lighter, almost glowing shades, capturing distant starlight.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Night Sky Lumina 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 Night Sky Lumina.

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

Data visualization

#0F1E3D#2C3D6D#4A5BA8#6D7BCE#989FF1

Palette guide

How to use Night Sky Lumina

Overview

The Night Sky Lumina palette features deep blues that transition to lighter, almost glowing shades, capturing distant starlight. With hues ranging from the profound #0F1E3D and #2C3D6D to the luminous #989FF1, this collection offers an elegant and mysterious aesthetic. It's perfectly suited for designers and developers crafting experiences for luxury brands, high-tech interfaces, or any project seeking to evoke sophistication, wonder, and a celestial calm. The gradual shift in luminosity allows for creating depth and focus, ideal for immersive digital environments and sophisticated branding.

Best used for

  • Luxury brand identity and websites
  • Technology and software interfaces
  • Space exploration and astronomy themes
  • Elegant event invitations and branding
  • Sophisticated dark mode applications
  • Cinematic and artistic digital projects

Suggested color roles

primary

Use #0F1E3D as the deepest, anchoring color for main backgrounds or large foundational elements, providing an elegant base.

secondary

Employ #2C3D6D for supporting sections, sidebars, or card backgrounds to add subtle depth and variation.

accent

The luminous #989FF1 serves as an excellent accent for highlights, interactive elements, or starlight-like visual cues.

background

The profound #0F1E3D or #2C3D6D provides a rich, immersive canvas, perfect for sophisticated dark mode designs.

text

Pair with white or a very light grey (e.g., #EEEEEE) for optimal readability and a luminous contrast on darker blues.

Accessibility notes

  • Ensure strong contrast for text on dark backgrounds; white text works well on #0F1E3D, #2C3D6D, and #4A5BA8.
  • For #6D7BCE and #989FF1, consider using dark text (e.g., #0F1E3D or charcoal) for better readability, especially for body text.
  • Utilize #989FF1 for interactive elements to ensure they stand out and meet WCAG contrast guidelines against darker backgrounds.
  • Avoid using mid-tone blues for small text against similar backgrounds to prevent readability issues.

Recommended combinations

Celestial Gradient

Creates a smooth, elegant transition for backgrounds, headers, or layered visual effects.

#0F1E3D · #2C3D6D · #4A5BA8

Starlight Contrast

Highlights key information or interactive elements with a luminous pop against a deep base.

#0F1E3D · #989FF1 · #4A5BA8

Deep Sky

Provides a balanced contrast for sections, combining depth with a touch of luminosity for visual interest.

#2C3D6D · #6D7BCE · #0F1E3D

CSS variables

:root {
  --night-sky-lumina-1: #0F1E3D;
  --night-sky-lumina-2: #2C3D6D;
  --night-sky-lumina-3: #4A5BA8;
  --night-sky-lumina-4: #6D7BCE;
  --night-sky-lumina-5: #989FF1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "night-sky-lumina": {
        1: "#0F1E3D",
        2: "#2C3D6D",
        3: "#4A5BA8",
        4: "#6D7BCE",
        5: "#989FF1",
      }
    }
  }
}

Related searches

night sky color schemeblue gradient palettecelestial UI designelegant dark colorsspace themed branding

Palette colors

Hex values

Color 1#0F1E3D
·
Color 2#2C3D6D
·
Color 3#4A5BA8
·
Color 4#6D7BCE
·
Color 5#989FF1
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.6:1Fail
4.2:1AA18
6.7:1AA
2
1.6:1Fail
1.7:1Fail
2.7:1Fail
4.3:1AA18
3
2.6:1Fail
1.7:1Fail
1.6:1Fail
2.6:1Fail
4
4.2:1AA18
2.7:1Fail
1.6:1Fail
1.6:1Fail
5
6.7:1AA
4.3:1AA18
2.6:1Fail
1.6:1Fail

Similar palettes

More like Night Sky Lumina

View all dark
Midnight Celestial Bloom
Night Sky Shimmer
Celestial Night Garden
Cosmic Stardust Haze
Elegant Sapphire Skies
Galactic Starlight Veil