Back to palettes

Palette

Morning Mist Valley

Gentle blues and muted greens reflecting the tranquil serenity of a valley enveloped in morning mist.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#ADCFD5#C0DDE3#D9EAF0#93B9BF#80A7AE

Palette guide

How to use Morning Mist Valley

Overview

The Morning Mist Valley palette features gentle blues and muted greens, perfectly reflecting the tranquil serenity of a valley enveloped in morning mist. With an airy background shade like #D9EAF0, it establishes a sense of openness and calm. Mid-tones such as #C0DDE3 and #ADCFD5 provide subtle depth, while the richer #93B9BF and #80A7AE offer grounding and more substantial presence. This palette is a valuable tool for designers and developers aiming to create peaceful, nature-inspired, and harmonious digital or print experiences that convey quietude and natural elegance.

Best used for

  • Eco-friendly and sustainable branding
  • Nature-themed websites and blogs
  • Health and wellness app interfaces
  • Spa and retreat marketing materials
  • Landscape photography portfolios
  • Travel and outdoor adventure promotions

Suggested color roles

primary

Use #ADCFD5 as a calm, natural base color for main content blocks or prominent design elements, providing a soothing foundation.

secondary

Apply #C0DDE3 for lighter, supportive tones in sub-sections, navigation, or subtle dividers.

accent

Utilize #80A7AE as a deeper, grounding element for important call-to-actions, strong borders, or key visual anchors.

background

Employ #D9EAF0 as the primary background color, creating an expansive, airy, and tranquil canvas.

text

For optimal readability, use #80A7AE or a dark grey for body text. #93B9BF can be used for secondary text or headings on light backgrounds.

Accessibility notes

  • Ensure strong contrast for text, particularly when using #D9EAF0 as a background for essential information.
  • Pair #80A7AE or #93B9BF with the lightest background #D9EAF0 for accessible and comfortable text readability.
  • Avoid using lighter shades like #C0DDE3 for small text on a #D9EAF0 background, as contrast will be insufficient.
  • For critical UI elements, ensure sufficient color difference, especially between adjacent colors like #ADCFD5 and #C0DDE3.

Recommended combinations

Valley Haze

Soft, layered backgrounds for serene digital interfaces or printed materials, evoking a fresh, misty feel.

#D9EAF0 · #C0DDE3 · #ADCFD5

Misty Depths

Harmonious button states or gradient fills, adding depth to UI elements or illustrations.

#ADCFD5 · #93B9BF · #80A7AE

Serene Peaks

Light background with #80A7AE for bold titles and #C0DDE3 for subtle graphical accents or inactive states.

#D9EAF0 · #80A7AE · #C0DDE3

CSS variables

:root {
  --morning-mist-valley-1: #ADCFD5;
  --morning-mist-valley-2: #C0DDE3;
  --morning-mist-valley-3: #D9EAF0;
  --morning-mist-valley-4: #93B9BF;
  --morning-mist-valley-5: #80A7AE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "morning-mist-valley": {
        1: "#ADCFD5",
        2: "#C0DDE3",
        3: "#D9EAF0",
        4: "#93B9BF",
        5: "#80A7AE",
      }
    }
  }
}

Related searches

tranquil blue green paletteserene nature colorsmisty valley aestheticcalm earthy toneseco friendly branding colors

Palette colors

Hex values

Color 1#ADCFD5
·
Color 2#C0DDE3
·
Color 3#D9EAF0
·
Color 4#93B9BF
·
Color 5#80A7AE
·

Accessibility

Contrast checker

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

Similar palettes

More like Morning Mist Valley

View all pastel
Morning Solstice Mist
Morning Mist Blossom
Cloud Shimmer Dawn
Cloud Soft Dawn
Cloudscape Dreamy Soft
Cloudspun Morning