Back to palettes

Palette

Alpine Morning Mist

Gentle and serene, inspired by the tranquil mist enveloping alpine peaks at dawn, quiet and profound.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Alpine Morning 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 Alpine Morning Mist.

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

Data visualization

#D3DDF2#AABFDF#81A0CE#BAD5E5#EFF4F9

Palette guide

How to use Alpine Morning Mist

Overview

The Alpine Morning Mist palette is a gentle and serene collection, inspired by the tranquil mist enveloping alpine peaks at dawn, evoking a quiet and profound atmosphere. It features a soft gradient of cool blues and near-whites, from the ethereal pale blue #EFF4F9 and #D3DDF2, through the muted #BAD5E5 and #AABFDF. The deepest tone, a calming royal blue #81A0CE, grounds the palette without losing its airy feel. This sophisticated palette is ideal for designers and developers seeking a calm, clean, and refreshing aesthetic. It's perfectly suited for projects requiring a sense of peace, clarity, or minimalist elegance, such as wellness apps, luxury spas, or serene digital environments.

Best used for

  • Wellness and meditation apps
  • Luxury spa or retreat branding
  • Minimalist website designs
  • Serene digital interfaces
  • Baby and children's product packaging
  • Nature-inspired art and photography

Suggested color roles

primary

Use #81A0CE as a calming, anchoring blue for primary content and core branding, conveying peace.

secondary

Apply #AABFDF as a soft, versatile mid-blue for secondary elements, adding subtlety and openness.

accent

Employ #BAD5E5 as a light, ethereal highlight for subtle accents or decorative details.

background

Utilize #EFF4F9 as a pristine, airy, almost white base, creating a sense of spaciousness and tranquility.

text

Set body text in #81A0CE for clear, readable text on light backgrounds, ensuring excellent legibility.

Accessibility notes

  • Text in #81A0CE on #EFF4F9 background offers good contrast, ensuring readability for most users.
  • Avoid using lighter blues like #D3DDF2 or #BAD5E5 for small text on similarly light backgrounds due to low contrast.
  • Use the darker blue for primary content and calls-to-action to ensure maximum legibility and visual hierarchy.
  • Ensure interactive elements have distinct visual cues in addition to color to aid navigation and usability.

Recommended combinations

Misty Peaks

Creates a soft, layered depth, ideal for backgrounds, headers, or atmospheric branding.

#81A0CE · #AABFDF · #D3DDF2

Dawn Sky

A light, ethereal combination perfect for subtle gradients, decorative elements, or clean layouts.

#EFF4F9 · #BAD5E5 · #AABFDF

Serene Horizon

Provides a balanced, calm flow, suitable for data visualization or layered UI components.

#D3DDF2 · #AABFDF · #81A0CE

CSS variables

:root {
  --alpine-morning-mist-1: #D3DDF2;
  --alpine-morning-mist-2: #AABFDF;
  --alpine-morning-mist-3: #81A0CE;
  --alpine-morning-mist-4: #BAD5E5;
  --alpine-morning-mist-5: #EFF4F9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "alpine-morning-mist": {
        1: "#D3DDF2",
        2: "#AABFDF",
        3: "#81A0CE",
        4: "#BAD5E5",
        5: "#EFF4F9",
      }
    }
  }
}

Related searches

soft blue calm palettemisty alpine colorsserene dawn schememinimalist blue gradienttranquil mountain colors

Palette colors

Hex values

Color 1#D3DDF2
·
Color 2#AABFDF
·
Color 3#81A0CE
·
Color 4#BAD5E5
·
Color 5#EFF4F9
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.4:1Fail
2:1Fail
1.1:1Fail
1.2:1Fail
2
1.4:1Fail
1.4:1Fail
1.2:1Fail
1.7:1Fail
3
2:1Fail
1.4:1Fail
1.7:1Fail
2.4:1Fail
4
1.1:1Fail
1.2:1Fail
1.7:1Fail
1.4:1Fail
5
1.2:1Fail
1.7:1Fail
2.4:1Fail
1.4:1Fail

Similar palettes

More like Alpine Morning Mist

View all cool