Back to palettes

Palette

Starlight City Glimmer

Cool, dusky blues and silvers that evoke the serene glimmer of city lights under a starlit sky.

coolelegant5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Starlight City Glimmer 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 Starlight City Glimmer.

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

Data visualization

#0A0F1A#2B3D5E#5A7AA8#9CCAEF#E0F0FA

Palette guide

How to use Starlight City Glimmer

Overview

The Starlight City Glimmer palette offers a sophisticated range of cool blues, perfect for evoking urban elegance and serene nightscapes. Starting with the deep, almost black #0A0F1A, it transitions through a rich #2B3D5E and a balanced #5A7AA8, culminating in the luminous #9CCAEF and the ethereal #E0F0FA. This gradient provides designers and developers with a versatile foundation for creating interfaces that feel calm, modern, and aspirational. Use it to build depth and visual interest, from subtle backgrounds to striking focal points, ensuring a cohesive and professional aesthetic. The subtle progression ensures smooth transitions and a premium feel across digital and print mediums.

Best used for

  • Luxury brand websites and apps
  • High-tech product interfaces
  • Nightlife event promotions
  • Urban photography portfolios
  • Serene meditation apps
  • Modern architectural firm branding

Suggested color roles

primary

#2B3D5E - A deep, calming blue, ideal for main brand colors, large sections, or navigation backgrounds, establishing a sophisticated tone.

secondary

#5A7AA8 - A balanced mid-tone, excellent for subheadings, secondary buttons, or data visualizations, providing contrast without being too stark.

accent

#9CCAEF - A vibrant, light blue perfect for call-to-action buttons, interactive elements, or highlighting key information, drawing immediate attention.

background

#E0F0FA - A very light, almost white blue, creating an airy and clean canvas for content, ensuring readability and a modern feel.

text

#0A0F1A - This dark, almost black blue provides excellent contrast against lighter backgrounds, ensuring high readability for body text and headlines.

Accessibility notes

  • Ensure #0A0F1A text on #E0F0FA background for optimal AA/AAA contrast ratios.
  • Avoid placing #9CCAEF text directly on #5A7AA8 without checking contrast; it might be insufficient for readability.
  • Use #2B3D5E or #0A0F1A for critical text elements on lighter backgrounds like #E0F0FA or even #9CCAEF (for large text).
  • For interactive elements, ensure focus states use a color with sufficient contrast against both the element's normal state and its background.

Recommended combinations

Deep Urban Night

Ideal for dark mode interfaces, striking hero sections, or elegant branding, with #E0F0FA as a luminous accent.

#0A0F1A · #2B3D5E · #E0F0FA

Skyline Glimmer

Great for header sections, data dashboards, or infographics, balancing mid-tones with a bright highlight.

#5A7AA8 · #9CCAEF · #2B3D5E

Serene Reflection

Perfect for clean, minimalist designs, using #0A0F1A for text and #5A7AA8 for subtle UI elements.

#E0F0FA · #0A0F1A · #5A7AA8

CSS variables

:root {
  --starlight-city-glimmer-1: #0A0F1A;
  --starlight-city-glimmer-2: #2B3D5E;
  --starlight-city-glimmer-3: #5A7AA8;
  --starlight-city-glimmer-4: #9CCAEF;
  --starlight-city-glimmer-5: #E0F0FA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "starlight-city-glimmer": {
        1: "#0A0F1A",
        2: "#2B3D5E",
        3: "#5A7AA8",
        4: "#9CCAEF",
        5: "#E0F0FA",
      }
    }
  }
}

Related searches

urban blue color schemenight city aesthetic palettecool elegant bluessophisticated blue gray colorsmodern dark blue palette

Palette colors

Hex values

Color 1#0A0F1A
·
Color 2#2B3D5E
·
Color 3#5A7AA8
·
Color 4#9CCAEF
·
Color 5#E0F0FA
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.8:1Fail
4.4:1AA18
11:1AAA
16.4:1AAA
2
1.8:1Fail
2.5:1Fail
6.3:1AA
9.3:1AAA
3
4.4:1AA18
2.5:1Fail
2.5:1Fail
3.8:1AA18
4
11:1AAA
6.3:1AA
2.5:1Fail
1.5:1Fail
5
16.4:1AAA
9.3:1AAA
3.8:1AA18
1.5:1Fail

Similar palettes

More like Starlight City Glimmer

View all cool
Cityscape Nocturne Blue
Cityscape Twilight Azure
Art Deco Metropolis
Concrete Jungle Bloom
Midnight Aurora Glide
Midnight Symphony Orchestra