Back to palettes

Palette

Peaceful Lake Mist

Soft, hazy blues and muted grays capture the tranquility of a misty morning over a calm lake.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#ADD8E6#E0FFFF#B0C4DE#C0D8D8#A0B0B0

Palette guide

How to use Peaceful Lake Mist

Overview

The Peaceful Lake Mist palette evokes tranquility with its soft, cool blues and muted grays, ideal for creating serene and calming digital experiences. Featuring hues like the gentle sky blue #ADD8E6, the almost ethereal #E0FFFF, and the grounding blue-gray #B0C4DE, this collection is perfect for designs aiming for a sense of calm. Complemented by the subtle teal-gray of #C0D8D8 and the deeper gray #A0B0B0, it provides a harmonious blend that mirrors a misty morning over a still lake. Designers can leverage these tones to build minimalist, clean, and inviting interfaces that prioritize user comfort and a relaxed aesthetic.

Best used for

  • Wellness and meditation app interfaces
  • Spa or retreat branding and websites
  • Minimalist interior design visualizations
  • Nature-themed digital art and illustrations
  • Serene background graphics for presentations
  • Eco-friendly product packaging

Suggested color roles

primary

Use #ADD8E6 as a dominant background or main content area color for a light, airy feel.

secondary

Apply #B0C4DE for secondary elements like navigation bars, side panels, or subtle data visualization.

accent

Incorporate #C0D8D8 for delicate accents, hover states, or subtle dividers to add depth without being obtrusive.

background

Utilize #E0FFFF as a pristine, near-white background for spacious layouts, enhancing the overall calm.

text

Pair lighter backgrounds with a dark gray or charcoal (e.g., #333333) for primary text, and #A0B0B0 for secondary text where contrast allows.

Accessibility notes

  • Ensure sufficient contrast between text and background, especially when using lighter shades like #ADD8E6 or #E0FFFF.
  • Use darker palette colors like #A0B0B0 for text on very light backgrounds to meet WCAG readability standards.
  • Avoid placing light text directly on #C0D8D8 or #A0B0B0 without careful contrast checking.
  • Test all critical text elements for readability against their chosen background using a contrast checker.

Recommended combinations

Misty Horizon

Ideal for a clean background, a soft primary element, and a grounding text or accent color.

#E0FFFF · #ADD8E6 · #A0B0B0

Calm Depths

Creates a gentle gradient effect, perfect for layered components or subtle visual hierarchy.

#B0C4DE · #C0D8D8 · #ADD8E6

Soft Contrast

A balanced combination for main content, secondary elements, and light highlights or backgrounds.

#ADD8E6 · #A0B0B0 · #E0FFFF

CSS variables

:root {
  --peaceful-lake-mist-1: #ADD8E6;
  --peaceful-lake-mist-2: #E0FFFF;
  --peaceful-lake-mist-3: #B0C4DE;
  --peaceful-lake-mist-4: #C0D8D8;
  --peaceful-lake-mist-5: #A0B0B0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "peaceful-lake-mist": {
        1: "#ADD8E6",
        2: "#E0FFFF",
        3: "#B0C4DE",
        4: "#C0D8D8",
        5: "#A0B0B0",
      }
    }
  }
}

Related searches

calm blue color palettemisty cool tonesserene UI colorswater inspired design palettemuted gray blue hex codes

Palette colors

Hex values

Color 1#ADD8E6
·
Color 2#E0FFFF
·
Color 3#B0C4DE
·
Color 4#C0D8D8
·
Color 5#A0B0B0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
1.2:1Fail
1:1Fail
1.5:1Fail
2
1.4:1Fail
1.7:1Fail
1.4:1Fail
2.1:1Fail
3
1.2:1Fail
1.7:1Fail
1.2:1Fail
1.3:1Fail
4
1:1Fail
1.4:1Fail
1.2:1Fail
1.5:1Fail
5
1.5:1Fail
2.1:1Fail
1.3:1Fail
1.5:1Fail

Similar palettes

More like Peaceful Lake Mist

View all cool
Lake Mist Reflection
Tranquil Waterfall Mist
Calm Ocean Swell
Glacial Lagoon Calm
Glacial Lake Mirror
Glacial Lake Serenity