Palette

Morning Lake Fog

Soft, muted tones that capture the serene and ethereal beauty of a foggy lake at dawn.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Morning Lake Fog 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 Morning Lake Fog.

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

Data visualization

#A9A9A9#B0C4DE#ADD8E6#778899#DCDCDC

Palette guide

How to use Morning Lake Fog

Overview

The Morning Lake Fog palette evokes tranquility and ethereal beauty, perfect for designs seeking a calm, sophisticated atmosphere. This cool, muted collection features a soothing range of grays and blues, including the gentle #DCDCDC (Gainsboro) and the slightly deeper #A9A9A9 (Dark Gray). Complementing these are the soft blues like #B0C4DE (Light Steel Blue) and the airy #ADD8E6 (Light Blue), grounded by the subtle depth of #778899 (Light Slate Gray). Designers and developers can leverage this palette to create serene user interfaces, contemplative branding, or elegant digital experiences that convey peace and clarity. Its subdued nature makes it versatile for backgrounds, subtle UI elements, and understated typography.

Best used for

Wellness and meditation app interfaces
Eco-friendly brand identity and packaging
Luxury spa and resort websites
Minimalist interior design concepts
Fine art photography portfolios
Environmental non-profit communication materials

Suggested color roles

primary

#B0C4DE. A calming yet distinct primary for headers, hero sections, or main interactive elements, offering a soft, approachable feel.

secondary

#A9A9A9. Use this versatile gray for supporting elements, subheadings, or as a sophisticated alternative to pure black in secondary text, providing visual weight without harshness.

accent

#ADD8E6. A delicate accent for subtle highlights, small icons, or call-to-action buttons where a gentle pop of color is desired, maintaining the palette's serene mood.

background

#DCDCDC. An excellent, near-white background color that provides a clean canvas without being stark, ensuring readability and a soft aesthetic.

text

#778899. An ideal dark gray for body text, offering strong readability against lighter backgrounds like #DCDCDC without the harshness of pure black, contributing to the overall calm.

Accessibility notes

Ensure sufficient contrast between #778899 text and #DCDCDC backgrounds (WCAG AA pass expected).
Avoid using #ADD8E6 directly for small text against #B0C4DE without checking contrast carefully; it may be too low.
For interactive elements, provide clear focus states and visual cues beyond color alone, especially with similar light tones.
Consider a darker shade for essential hyperlinks if using #ADD8E6 or #B0C4DE to ensure visibility for all users.

Recommended combinations

Misty UI

Ideal for clean, modern user interfaces where #DCDCDC acts as the background, #B0C4DE for primary elements, and #778899 for readable text.

#DCDCDC · #B0C4DE · #778899

Serene Branding

Perfect for brand logos, headers, or marketing materials, with #A9A9A9 providing grounding and the blues adding a tranquil, ethereal touch.

#A9A9A9 · #ADD8E6 · #B0C4DE

Subtle Gradient

Useful for subtle background gradients or layered UI elements, transitioning smoothly between the light blues and anchoring with the muted slate gray for depth.

#B0C4DE · #ADD8E6 · #778899

CSS variables

:root {
  --morning-lake-fog-1: #A9A9A9;
  --morning-lake-fog-2: #B0C4DE;
  --morning-lake-fog-3: #ADD8E6;
  --morning-lake-fog-4: #778899;
  --morning-lake-fog-5: #DCDCDC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "morning-lake-fog": {
        1: "#A9A9A9",
        2: "#B0C4DE",
        3: "#ADD8E6",
        4: "#778899",
        5: "#DCDCDC",
      }
    }
  }
}

Hex values

Color 1#A9A9A9

Color 2#B0C4DE

Color 3#ADD8E6

Color 4#778899

Color 5#DCDCDC

Accessibility

Contrast checker

1.3:1Fail

1.5:1Fail

1.7:1Fail

1.3:1Fail

1.2:1Fail

2:1Fail

1.3:1Fail

1.5:1Fail

1.2:1Fail

2.4:1Fail

1.1:1Fail

1.5:1Fail

2:1Fail

2.4:1Fail

2.7:1Fail

1.7:1Fail

1.3:1Fail

1.1:1Fail

2.7:1Fail

Similar palettes

More like Morning Lake Fog

Morning Lake Fog

See it in context.

Ready when you are.

Built with Morning Lake Fog.

How to use Morning Lake Fog

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Misty UI

Serene Branding

Subtle Gradient

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Morning Lake Fog