Back to palettes

Palette

Celestial Night Sky

A deep and meditative range of blues and purples, evoking the infinite serenity of a clear 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

#000080#191970#483D8B#8A2BE2#6A5ACD

Palette guide

How to use Celestial Night Sky

Overview

The Celestial Night Sky palette is a deep and meditative collection of blues and purples, reflecting the infinite serenity of a clear, mystical night sky. Ranging from the profound navy of #000080 to the vibrant violet of #8A2BE2, this palette offers a rich spectrum for creating elegant and atmospheric designs. The harmonious blend of #191970 and #483D8B provides excellent mid-tones, allowing for depth and visual interest. Designers can craft immersive experiences that convey wisdom and tranquility, while developers will find these distinct hex codes perfect for implementing sophisticated dark themes or artistic visual elements.

Best used for

  • Astrology or spiritual wellness platforms
  • Luxury travel or retreat websites
  • Meditation and mindfulness apps
  • High-end educational content (e.g., documentaries)
  • Fantasy or mystical-themed digital art
  • Elegant personal branding

Suggested color roles

primary

#000080 establishes a commanding deep navy base for backgrounds or main structural elements.

secondary

#483D8B offers a rich, muted purple-blue, suitable for secondary panels, headers, or prominent text.

accent

#8A2BE2 provides a vibrant, captivating violet, ideal for calls-to-action, interactive elements, or key highlights.

background

#000080 or #191970 create a deep, immersive cosmic backdrop.

text

Use white or a very light color like #6A5ACD for primary text on the darkest backgrounds.

Accessibility notes

  • Ensure white or very light text (e.g., #8A2BE2) provides sufficient contrast on #000080 and #191970.
  • #8A2BE2 (blue violet) needs careful contrast checking when used for text against #483D8B or #6A5ACD.
  • Avoid using #191970 for text on #000080 as the contrast will be insufficient.
  • Prioritize clear, sans-serif fonts for readability, especially with the deeper color combinations.

Recommended combinations

Mystic Depths

Ideal for hero sections or dramatic visual displays, combining deep blues with a vibrant violet accent.

#000080 · #483D8B · #8A2BE2

Serene Twilight

Excellent for layered UI elements, showcasing a smooth transition from deep to vibrant blues.

#191970 · #6A5ACD · #8A2BE2

Cosmic Harmony

Creates a cohesive and calming aesthetic, suitable for intros or atmospheric backgrounds.

#000080 · #191970 · #6A5ACD

CSS variables

:root {
  --celestial-night-sky-1: #000080;
  --celestial-night-sky-2: #191970;
  --celestial-night-sky-3: #483D8B;
  --celestial-night-sky-4: #8A2BE2;
  --celestial-night-sky-5: #6A5ACD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "celestial-night-sky": {
        1: "#000080",
        2: "#191970",
        3: "#483D8B",
        4: "#8A2BE2",
        5: "#6A5ACD",
      }
    }
  }
}

Related searches

deep blue purple palettemystical night sky colorscelestial dark mode themeindigo violet color schemeserene cosmic branding

Palette colors

Hex values

Color 1#000080
·
Color 2#191970
·
Color 3#483D8B
·
Color 4#8A2BE2
·
Color 5#6A5ACD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.8:1Fail
2.7:1Fail
3:1AA18
2
1.1:1Fail
1.6:1Fail
2.5:1Fail
2.8:1Fail
3
1.8:1Fail
1.6:1Fail
1.5:1Fail
1.7:1Fail
4
2.7:1Fail
2.5:1Fail
1.5:1Fail
1.1:1Fail
5
3:1AA18
2.8:1Fail
1.7:1Fail
1.1:1Fail

Similar palettes

More like Celestial Night Sky

View all dark
Starlit Canvas
Starry Night Horizon
Celestial Glimmer Dust
Celestial Night Bloom
Celestial Sapphire Dust
Celestial Void Gaze