Back to palettes

Palette

Desert Night Sky

A serene view of the expansive desert night, with deep blues fading to a starlit horizon.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1A1E29#353D50#5B6A88#899ABB#B8C7DD

Palette guide

How to use Desert Night Sky

Overview

The "Desert Night Sky" palette offers a serene view of the expansive desert night, with deep blues fading to a starlit horizon. This cool collection ranges from the near-black #1A1E29 to the light, airy #B8C7DD. Key colors include the deep blue #353D50, the mid-tone #5B6A88, and the softer #899ABB. This palette is designed to evoke tranquility, vastness, and calm, making it perfect for projects that require a peaceful and sophisticated aesthetic. It's particularly well-suited for digital interfaces, educational content, or branding that aims for a serene, contemplative mood.

Best used for

  • Tranquil website and application interfaces
  • Educational content related to astronomy or science
  • Relaxation and meditation apps
  • Minimalist or abstract art showcases
  • Branding for luxury resorts or travel destinations
  • E-commerce sites for high-end electronics

Suggested color roles

primary

Use #353D50 as a stable, deep blue for main sections, backgrounds, or foundational branding elements.

secondary

Employ #5B6A88 for supporting content, subheadings, or graphical elements, adding depth without heaviness.

accent

Reserve #B8C7DD for delicate highlights, small icons, or important text on dark backgrounds, mimicking starlight.

background

Utilize #1A1E29 as a deep, dark blue-black background, creating an expansive and immersive canvas.

text

For optimal readability on dark backgrounds, use #B8C7DD or a crisp white. For lighter elements, a dark charcoal is recommended.

Accessibility notes

  • #B8C7DD offers excellent contrast against #1A1E29 and #353D50 for text, ensuring high readability.
  • Avoid using #899ABB on #5B6A88 for text due to insufficient contrast; reserve lighter shades for larger headings or accents.
  • Ensure all body text on mid-tones like #5B6A88 uses #B8C7DD or white to meet accessibility standards.
  • Interactive elements should be clearly distinguishable, potentially using #B8C7DD for button text or hover states.

Recommended combinations

Starlit Horizon

Creates a deep, ethereal composition, ideal for hero sections or backgrounds that evoke a sense of wonder.

#1A1E29 · #5B6A88 · #B8C7DD

Dusk Gradient

A smooth, transitional blend, excellent for layered interfaces or sections that depict a gradual change.

#353D50 · #899ABB · #B8C7DD

Tranquil Night

Offers a calm and sophisticated feel, suitable for content blocks or visual elements requiring depth and serenity.

#5B6A88 · #1A1E29 · #899ABB

CSS variables

:root {
  --desert-night-sky-2-1: #1A1E29;
  --desert-night-sky-2-2: #353D50;
  --desert-night-sky-2-3: #5B6A88;
  --desert-night-sky-2-4: #899ABB;
  --desert-night-sky-2-5: #B8C7DD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "desert-night-sky-2": {
        1: "#1A1E29",
        2: "#353D50",
        3: "#5B6A88",
        4: "#899ABB",
        5: "#B8C7DD",
      }
    }
  }
}

Related searches

cool blue color palettenight sky design colorstranquil design aestheticastronomy theme palettedark blue gradient

Palette colors

Hex values

Color 1#1A1E29
·
Color 2#353D50
·
Color 3#5B6A88
·
Color 4#899ABB
·
Color 5#B8C7DD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
3.1:1AA18
5.9:1AA
9.7:1AAA
2
1.5:1Fail
2:1Fail
3.8:1AA18
6.3:1AA
3
3.1:1AA18
2:1Fail
1.9:1Fail
3.2:1AA18
4
5.9:1AA
3.8:1AA18
1.9:1Fail
1.7:1Fail
5
9.7:1AAA
6.3:1AA
3.2:1AA18
1.7:1Fail

Similar palettes

More like Desert Night Sky

View all cool