Back to palettes

Palette

Stormy Lake Mist

Deep, atmospheric greys and blues capturing the moody tranquility of a lake beneath a stormy sky.

DarkDark5 colors
More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Stormy Lake Mist 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 Stormy Lake Mist.

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

Data visualization

#263238#37474F#546E7A#B0BEC5#78909C

Palette guide

How to use Stormy Lake Mist

Overview

The Stormy Lake Mist palette evokes the moody tranquility of a lake under a stormy sky, blending deep, atmospheric greys and blues. Ranging from the profound #263238 to the misty #B0BEC5, with versatile mid-tones like #546E7A and #78909C, this collection is ideal for designers and developers aiming for a sophisticated, calm, and slightly mysterious aesthetic. It's perfect for creating depth in UI, impactful branding, or evocative digital art that conveys a sense of serene power and natural elegance.

Best used for

  • Dark mode interfaces
  • Luxury brand identity
  • Nature-inspired photography websites
  • Environmental advocacy platforms
  • Spa and relaxation app design
  • High-end architectural presentations

Suggested color roles

primary

#263238 - The darkest, most grounding shade, ideal for dominant backgrounds, strong headers, or foundational elements, providing significant depth.

secondary

#37474F - A deep, cool blue-gray, excellent for subheadings, navigation, or secondary informational panels.

accent

#B0BEC5 - The lightest, mistiest shade, perfect for subtle highlights, borders, or ghost buttons, offering a gentle lift.

background

#78909C - A versatile mid-tone blue-gray that provides a balanced canvas for content, maintaining the palette's overall depth.

text

#B0BEC5 - For primary body text on dark backgrounds like #263238 or #37474F, ensuring legibility and maintaining the moody aesthetic.

Accessibility notes

  • #B0BEC5 text on #263238 background should be checked for WCAG AA compliance, especially for small font sizes.
  • Use a slightly brighter white or off-white for critical text if #B0BEC5 contrast is insufficient on darker shades.
  • Ensure interactive elements have clear visual states, perhaps using the lightest shade for focus.
  • Avoid placing light gray text like #B0BEC5 directly on #78909C without checking contrast.

Recommended combinations

Deep Serenity

Robust pairing for dark mode UIs, with the light gray for text and the deep blue for subtle separation.

#263238 · #B0BEC5 · #37474F

Misty Layers

Smooth, layered look for backgrounds and content areas, creating a sophisticated visual flow reminiscent of mist.

#37474F · #546E7A · #78909C

Accentuated Calm

Harmonious blend for secondary information, borders, and subtle graphical elements, anchored by the darkest tone.

#546E7A · #B0BEC5 · #263238

CSS variables

:root {
  --stormy-lake-mist-1: #263238;
  --stormy-lake-mist-2: #37474F;
  --stormy-lake-mist-3: #546E7A;
  --stormy-lake-mist-4: #B0BEC5;
  --stormy-lake-mist-5: #78909C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "stormy-lake-mist": {
        1: "#263238",
        2: "#37474F",
        3: "#546E7A",
        4: "#B0BEC5",
        5: "#78909C",
      }
    }
  }
}

Related searches

moody blue gray dark paletteserene lake colorsatmospheric UI designelegant dark cool tonesnature inspired dark theme

Palette colors

Hex values

Color 1#263238
·
Color 2#37474F
·
Color 3#546E7A
·
Color 4#B0BEC5
·
Color 5#78909C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2.4:1Fail
6.9:1AA
3.9:1AA18
2
1.4:1Fail
1.8:1Fail
5.1:1AA
2.9:1Fail
3
2.4:1Fail
1.8:1Fail
2.8:1Fail
1.6:1Fail
4
6.9:1AA
5.1:1AA
2.8:1Fail
1.8:1Fail
5
3.9:1AA18
2.9:1Fail
1.6:1Fail
1.8:1Fail

Similar palettes

More like Stormy Lake Mist

View all Dark
Haunted Hallway Gloom
Midnight Urban Blues
Tempest Cloud Shadow
Abyssal Bioluminescence
Abyssal Seaweed Garden
Deep Forest Murmur