Back to palettes

Palette

Winter Twilight Dream

Soft, muted blues and subtle greys capture the serene, fading light of a winter evening.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Winter Twilight Dream 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 Twilight Dream.

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

Data visualization

#465881#7B9CA9#B3D1DB#2C3E50#5A7790

Palette guide

How to use Winter Twilight Dream

Overview

The Winter Twilight Dream palette offers a serene and contemplative collection of soft, muted blues and subtle greys, perfectly capturing the fading light of a winter evening. With shades like the inviting #465881 (Steel Blue) and the airy #B3D1DB (Light Blue), this palette fosters a sense of calm and sophistication. The deeper #2C3E50 (Dark Slate Gray) anchors the scheme, providing a strong foundation, while #7B9CA9 (Cadet Blue) and #5A7790 (Slate Gray) offer versatile mid-tones. It's an excellent choice for designers seeking a cool, professional, and tranquil aesthetic across various digital and print applications.

Best used for

  • Corporate websites with a calming aesthetic
  • Healthcare or wellness apps
  • Luxury brand packaging
  • Architectural portfolios
  • Winter-themed digital illustrations
  • Educational platforms

Suggested color roles

primary

The deep Dark Slate Gray (#2C3E50) serves as a sophisticated primary, ideal for main navigation, footers, or bold headlines.

secondary

Steel Blue (#465881) offers a versatile secondary, great for content sections, card backgrounds, or prominent UI elements.

accent

Light Blue (#B3D1DB) provides a soft, refreshing accent, perfect for highlights, subtle interactive elements, or secondary text.

background

Cadet Blue (#7B9CA9) can serve as a gentle, muted background, offering a soft alternative to pure white for a tranquil feel.

text

For dark backgrounds, use #B3D1DB or a crisp white. For lighter backgrounds like #B3D1DB, use #2C3E50 or a deep charcoal for readability.

Accessibility notes

  • Ensure text in #B3D1DB has sufficient contrast against background colors like #7B9CA9; a darker text color (e.g., #2C3E50) is often needed.
  • The darker shades like #2C3E50 and #465881 provide excellent contrast for light text (e.g., #B3D1DB or white).
  • Avoid using #7B9CA9 for small text on #5A7790 without careful contrast checking; prefer a more distinct contrast.
  • For body text, a robust dark grey (e.g., #333333) or #2C3E50 is recommended on lighter backgrounds.

Recommended combinations

Serene Horizon

Creates a deep, tranquil look; ideal for hero sections with dark backgrounds, prominent titles, and light accent details.

#2C3E50 · #465881 · #B3D1DB

Muted Harmony

Excellent for content cards or sub-sections, offering subtle depth and a professional, understated feel.

#7B9CA9 · #5A7790 · #2C3E50

Light Touch

Suitable for very light UI elements, where #B3D1DB is the background, and the other blues provide structure and text.

#B3D1DB · #465881 · #7B9CA9

CSS variables

:root {
  --winter-twilight-dream-1: #465881;
  --winter-twilight-dream-2: #7B9CA9;
  --winter-twilight-dream-3: #B3D1DB;
  --winter-twilight-dream-4: #2C3E50;
  --winter-twilight-dream-5: #5A7790;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "winter-twilight-dream": {
        1: "#465881",
        2: "#7B9CA9",
        3: "#B3D1DB",
        4: "#2C3E50",
        5: "#5A7790",
      }
    }
  }
}

Related searches

winter blue grey palettecalm evening color schemesophisticated cool tonestranquil UI colorsmuted blue web design

Palette colors

Hex values

Color 1#465881
·
Color 2#7B9CA9
·
Color 3#B3D1DB
·
Color 4#2C3E50
·
Color 5#5A7790
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.4:1Fail
4.4:1AA18
1.6:1Fail
1.5:1Fail
2
2.4:1Fail
1.8:1Fail
3.8:1AA18
1.6:1Fail
3
4.4:1AA18
1.8:1Fail
6.8:1AA
2.9:1Fail
4
1.6:1Fail
3.8:1AA18
6.8:1AA
2.3:1Fail
5
1.5:1Fail
1.6:1Fail
2.9:1Fail
2.3:1Fail

Similar palettes

More like Winter Twilight Dream

View all cool
Glacial Lake Mist
Agate Grotto
Alpine Frost Serenity
Arctic Bloom Whisper
Arctic Lake Ice
Arctic Serenity