Back to palettes

Palette

Winter Twilight Lake

Cool blues and grays reflect the serene, frosted silence of a winter lake at twilight.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#2F4F4F#4682B4#708090#A9A9A9#DCDCDC

Palette guide

How to use Winter Twilight Lake

Overview

The Winter Twilight Lake palette (original) reflects the serene, frosted silence of a winter lake at twilight, blending cool blues and grays. This versatile scheme features the grounding #2F4F4F (Dark Slate Gray) and the classic #4682B4 (Steel Blue), offering both depth and a touch of vibrancy. The mid-tones, including #708090 (Slate Gray) and #A9A9A9 (Dark Gray), provide excellent flexibility for subtle hierarchy, while #DCDCDC (Gainsboro) offers a near-white lightness. It's a fantastic choice for designers seeking a sophisticated, understated, and calming aesthetic with a cool, natural feel across various applications.

Best used for

  • Professional corporate websites
  • Photography portfolios
  • Winter fashion e-commerce
  • Journalism or editorial layouts
  • Interior design visualization
  • Environmental non-profit branding

Suggested color roles

primary

Dark Slate Gray (#2F4F4F) serves as a robust primary, ideal for main backgrounds, strong typography, or foundational elements.

secondary

Steel Blue (#4682B4) offers a versatile secondary, great for prominent calls to action, section headers, or interactive elements.

accent

Gainsboro (#DCDCDC) provides a bright, clean accent, perfect for highlights, subtle borders, or background elements that need to feel expansive.

background

Slate Gray (#708090) can serve as a sophisticated, muted background for content cards or secondary sections, offering subtle depth.

text

On dark backgrounds, use #DCDCDC or white. On lighter backgrounds like #DCDCDC, use #2F4F4F or a deep charcoal for optimal readability.

Accessibility notes

  • Ensure text in #DCDCDC has sufficient contrast against background colors like #A9A9A9 or #708090; a darker text color (e.g., #2F4F4F) is often needed.
  • The deep #2F4F4F provides excellent contrast for light text, ensuring WCAG AA compliance.
  • Avoid using #A9A9A9 for small text on #708090 without careful contrast checking; prefer a more distinct contrast.
  • For body text on lighter backgrounds, a robust dark grey (e.g., #333333) or #2F4F4F is recommended to maintain legibility.

Recommended combinations

Frosted Depths

Creates a strong, cool contrast, ideal for hero sections with dark backgrounds, vibrant accents, and light text.

#2F4F4F · #4682B4 · #DCDCDC

Gray Harmony

Excellent for content cards or subtle UI elements, providing a sophisticated monochromatic gray base with dark text.

#708090 · #A9A9A9 · #2F4F4F

Clear Horizon

Suitable for light, clean layouts, using the lightest shade as background with a vibrant blue accent and muted gray text.

#DCDCDC · #4682B4 · #708090

CSS variables

:root {
  --winter-twilight-lake-1: #2F4F4F;
  --winter-twilight-lake-2: #4682B4;
  --winter-twilight-lake-3: #708090;
  --winter-twilight-lake-4: #A9A9A9;
  --winter-twilight-lake-5: #DCDCDC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "winter-twilight-lake": {
        1: "#2F4F4F",
        2: "#4682B4",
        3: "#708090",
        4: "#A9A9A9",
        5: "#DCDCDC",
      }
    }
  }
}

Related searches

winter grey blue palettefrozen lake color schemecool muted tones UIsophisticated winter colorscalm blue gray web design

Palette colors

Hex values

Color 1#2F4F4F
·
Color 2#4682B4
·
Color 3#708090
·
Color 4#A9A9A9
·
Color 5#DCDCDC
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.2:1Fail
2.2:1Fail
3.8:1AA18
6.5:1AA
2
2.2:1Fail
1:1Fail
1.7:1Fail
3:1Fail
3
2.2:1Fail
1:1Fail
1.7:1Fail
3:1Fail
4
3.8:1AA18
1.7:1Fail
1.7:1Fail
1.7:1Fail
5
6.5:1AA
3:1Fail
3:1Fail
1.7:1Fail

Similar palettes

More like Winter Twilight Lake

View all cool
Winter Twilight Lake
Frosted Winter Lake
Solstice Forest Grey
Winter Sky
Winter Solstice Freeze
Winter Solstice Mist