Back to palettes

Palette

Celestial Night Sky

Profound, deep blues and purples representing the boundless, starry expanse of the night sky.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#00002A#191940#333366#0A0A2E#222250

Palette guide

How to use Celestial Night Sky

Overview

This Celestial Night Sky palette presents a profoundly deep and harmonious range of dark blues, evoking the boundless expanse of a clear, starless night. From the near-black #00002A to the slightly lighter, yet still intense #333366, these hex codes create an immersive and sophisticated atmosphere. It's an excellent choice for designs that prioritize depth, tranquility, and a sense of infinite space. Designers can utilize this palette for creating powerful, minimalist interfaces, while developers will appreciate the consistency for building elegant dark mode themes, ensuring a cohesive and professional visual experience across applications.

Best used for

  • Astrophotography websites or apps
  • Luxury technology brands (e.g., high-end audio)
  • Meditation or mindfulness applications
  • Space exploration themed content
  • Professional corporate dark mode themes
  • Abstract digital art backgrounds

Suggested color roles

primary

#191940 offers a deep, foundational blue, suitable for main content panels or primary backgrounds.

secondary

#222250 provides a slightly warmer dark blue, good for navigation, cards, or distinction.

accent

#333366 can serve as a subtle accent for borders, outlines, or very subdued interactive elements within the dark theme.

background

#00002A or #0A0A2E create the deepest, most immersive background for a true "night sky" feel.

text

Use white or a very light gray (e.g., #EEEEEE) for all text on these deep backgrounds to ensure maximum readability.

Accessibility notes

  • Crucially, use white or very light text (e.g., #F0F0F0) for all content on these dark backgrounds to meet contrast standards.
  • Avoid using any of these dark blues for text against each other, as contrast will be insufficient.
  • Interactive elements should have a clear visual indicator beyond just color difference, such as an icon or underline, if using similar dark shades.
  • Ensure focus states for interactive elements are highly visible, perhaps with a bright white or a very light outline.

Recommended combinations

Deep Cosmos

Perfect for creating a layered, immersive dark background with subtle depth.

#00002A · #191940 · #333366

Night Serenity

Ideal for main content areas where subtle distinction between panels is desired.

#0A0A2E · #222250 · #191940

Dark Horizon

Effective for gradients or visual elements that transition from ultra-dark to a slightly lighter deep blue.

#00002A · #222250 · #333366

CSS variables

:root {
  --celestial-night-sky-2-1: #00002A;
  --celestial-night-sky-2-2: #191940;
  --celestial-night-sky-2-3: #333366;
  --celestial-night-sky-2-4: #0A0A2E;
  --celestial-night-sky-2-5: #222250;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-night-sky-2": {
        1: "#00002A",
        2: "#191940",
        3: "#333366",
        4: "#0A0A2E",
        5: "#222250",
      }
    }
  }
}

Related searches

deep blue dark modenight sky color schememinimalist dark UIgalaxy blue paletteprofessional dark theme

Palette colors

Hex values

Color 1#00002A
·
Color 2#191940
·
Color 3#333366
·
Color 4#0A0A2E
·
Color 5#222250
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.7:1Fail
1.1:1Fail
1.4:1Fail
2
1.2:1Fail
1.4:1Fail
1.1:1Fail
1.1:1Fail
3
1.7:1Fail
1.4:1Fail
1.6:1Fail
1.3:1Fail
4
1.1:1Fail
1.1:1Fail
1.6:1Fail
1.3:1Fail
5
1.4:1Fail
1.1:1Fail
1.3:1Fail
1.3:1Fail

Similar palettes

More like Celestial Night Sky

View all dark
Celestial Void Gaze
Cosmic Drift Dust
Cosmic Dust Whisper
Cosmic Reaches
Galactic Night Voyage
Midnight Star Dust