Back to palettes

Palette

Night Sky Shimmer

Deep blues with hints of shimmering lighter tones evoke the vast, sparkling expanse of the night sky.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#0F152F#1F2B59#3A4B8F#5F7AD5#9AB5F0

Palette guide

How to use Night Sky Shimmer

Overview

The "Night Sky Shimmer" color palette offers a sophisticated journey through deep blues, reminiscent of a starlit expanse. Dominated by rich tones like #0F152F and #1F2B59, it transitions smoothly into vibrant mid-tones such as #3A4B8F and #5F7AD5, culminating in the ethereal shimmer of #9AB5F0. This elegant collection is ideal for creating designs that exude depth, tranquility, and a touch of cosmic wonder. Designers can leverage its gradient potential for immersive backgrounds, while developers will find its varying luminosities excellent for establishing visual hierarchy in UI elements. It’s perfect for evoking a sense of luxury, technology, or serene introspection.

Best used for

  • High-end tech product interfaces
  • Luxury brand websites and packaging
  • Space-themed educational content or apps
  • Elegant event invitations and branding
  • Serene meditation or relaxation apps
  • Modern corporate branding with a sophisticated edge

Suggested color roles

primary

#0F152F serves as a profound, anchoring primary color, perfect for main backgrounds or dominant branding elements where a deep, elegant foundation is desired.

secondary

#3A4B8F provides a balanced mid-tone, excellent for secondary sections, large text blocks, or interactive elements that need to stand out subtly against the darker primary.

accent

#5F7AD5 is a vibrant and shimmering accent, ideal for calls-to-action, active states, key icons, or small visual highlights that demand attention and convey energy.

background

#0F152F establishes a luxurious, deep night-sky background, providing a sophisticated canvas that makes lighter elements, especially #9AB5F0, truly pop.

text

For dark backgrounds like #0F152F or #1F2B59, use #9AB5F0 for primary text to ensure readability, or a pure white for maximum contrast on critical headlines.

Accessibility notes

  • Ensure sufficient contrast between lighter palette colors like #9AB5F0 and darker ones such as #0F152F for all text and interactive elements.
  • Avoid using mid-tones like #3A4B8F or #1F2B59 for small text on similarly dark backgrounds without testing contrast ratios.
  • When using #5F7AD5 as an accent, verify its contrast against both very dark and very light adjacent colors for icon legibility.
  • Consider providing a high-contrast mode for users with visual impairments, potentially using #9AB5F0 text on #0F152F.

Recommended combinations

Deep Galactic

Ideal for creating a sophisticated, deep interface where #0F152F forms the background, #1F2B59 provides subtle depth, and #9AB5F0 is used for readable text and highlights.

#0F152F · #1F2B59 · #9AB5F0

Cosmic Glow

Perfect for UI components or data visualizations, using #1F2B59 as a base, #3A4B8F for secondary information, and #5F7AD5 to draw attention to key metrics or interactive elements.

#1F2B59 · #3A4B8F · #5F7AD5

Shimmering Gradient

Excellent for gradients, hero sections, or illustrative elements that need to convey a smooth transition from a medium-dark to a bright, shimmering light.

#3A4B8F · #5F7AD5 · #9AB5F0

CSS variables

:root {
  --night-sky-shimmer-1: #0F152F;
  --night-sky-shimmer-2: #1F2B59;
  --night-sky-shimmer-3: #3A4B8F;
  --night-sky-shimmer-4: #5F7AD5;
  --night-sky-shimmer-5: #9AB5F0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "night-sky-shimmer": {
        1: "#0F152F",
        2: "#1F2B59",
        3: "#3A4B8F",
        4: "#5F7AD5",
        5: "#9AB5F0",
      }
    }
  }
}

Related searches

dark blue color schemeselegant night sky palettedeep blue ui colorsspace themed color designluxury blue branding palette

Palette colors

Hex values

Color 1#0F152F
·
Color 2#1F2B59
·
Color 3#3A4B8F
·
Color 4#5F7AD5
·
Color 5#9AB5F0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
2.2:1Fail
4.5:1AA18
8.8:1AAA
2
1.3:1Fail
1.7:1Fail
3.4:1AA18
6.6:1AA
3
2.2:1Fail
1.7:1Fail
2:1Fail
4:1AA18
4
4.5:1AA18
3.4:1AA18
2:1Fail
2:1Fail
5
8.8:1AAA
6.6:1AA
4:1AA18
2:1Fail

Similar palettes

More like Night Sky Shimmer

View all dark
Galactic Starlight Veil
Midnight Velvet Starry
Night Sky Lumina
Cosmic Drama Scene
Cosmic Stardust Haze
Elegant Sapphire Skies