Palette

Winter Solstice Aura

A serene, cool palette echoing the profound silence and deep blues of the longest night of the year.

cooldark5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Winter Solstice Aura 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 Winter Solstice Aura.

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

Data visualization

#1A2E3D#3E5F7B#729DB2#0A1C28#5A839E

Palette guide

How to use Winter Solstice Aura

Overview

The Winter Solstice Aura palette is a serene, cool collection echoing the profound silence and deep blues of the longest night of the year. Featuring exceptionally deep shades like #0A1C28 and #1A2E3D, complemented by rich blues such as #3E5F7B, #5A839E, and the softer #729DB2, this palette is perfect for designers and developers seeking a deeply elegant and atmospheric aesthetic. It’s ideal for creating immersive dark mode interfaces, sophisticated branding, or editorial content that conveys mystery, tranquility, and a refined sense of luxury. This collection promotes a meditative and sophisticated visual experience.

Best used for

Luxury product websites (e.g., watches, jewelry)
High-end photography portfolios
Dark theme UI for professional applications
Art and cultural institution digital platforms
Exclusive event invitations or branding
Mysterious and elegant storytelling platforms

Suggested color roles

primary

Serves as a powerful, anchoring base for dark mode backgrounds, headers, or primary brand elements using #0A1C28.

secondary

Provides a rich, supportive tone for significant content blocks or layered dark UI elements with #1A2E3D.

accent

A sophisticated accent for interactive elements, subtle highlights, or calls-to-action against dark backgrounds using #5A839E.

background

Offers a lighter, breathable canvas that can be used for secondary backgrounds or to lighten specific sections, utilizing #729DB2.

text

Ideal for body text against very dark backgrounds, ensuring excellent readability and elegance with #729DB2.

Accessibility notes

Ensure robust contrast for text using #729DB2 or #5A839E against #0A1C28 or #1A2E3D, especially for dark themes.
Avoid using #3E5F7B for small text on #1A2E3D without strict contrast checks.
For interactive elements, ensure distinct hover/active states with sufficient contrast using lighter blues.
This palette excels in dark mode, but always verify WCAG AA standards for all text and UI elements.

Recommended combinations

Deep Solstice

Creates a dramatic, high-contrast dark theme for luxury branding, hero sections, or immersive experiences.

#0A1C28 · #729DB2 · #1A2E3D

Aura Layers

Ideal for subtle gradients, layered dark UI components, or visual depth in sophisticated layouts.

#1A2E3D · #3E5F7B · #5A839E

Elegant Glow

Perfect for light text on dark backgrounds, providing clear readability and an elegant, luminous feel.

#729DB2 · #5A839E · #0A1C28

CSS variables

:root {
  --winter-solstice-aura-1: #1A2E3D;
  --winter-solstice-aura-2: #3E5F7B;
  --winter-solstice-aura-3: #729DB2;
  --winter-solstice-aura-4: #0A1C28;
  --winter-solstice-aura-5: #5A839E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "winter-solstice-aura": {
        1: "#1A2E3D",
        2: "#3E5F7B",
        3: "#729DB2",
        4: "#0A1C28",
        5: "#5A839E",
      }
    }
  }
}

Hex values

Color 1#1A2E3D

Color 2#3E5F7B

Color 3#729DB2

Color 4#0A1C28

Color 5#5A839E

Accessibility

Contrast checker

2.1:1Fail

4.8:1AA

1.2:1Fail

3.4:1AA18

2.1:1Fail

2.3:1Fail

2.6:1Fail

1.7:1Fail

4.8:1AA

2.3:1Fail

5.9:1AA

1.4:1Fail

1.2:1Fail

2.6:1Fail

5.9:1AA

4.3:1AA18

3.4:1AA18

1.7:1Fail

1.4:1Fail

4.3:1AA18

Similar palettes

More like Winter Solstice Aura

View all cool

Cosmic Ocean Deep

Starry Midnight Serene

Abyssal Current Glide

Bioluminescent Abyss

Cobalt Abyss Depths

Cobalt Midnight Sky