Back to palettes

Palette

Morning Haze Dew

A gentle and ethereal palette, capturing the serene quietude of a misty morning with soft, muted tones.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Morning Haze Dew 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 Haze Dew.

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

Data visualization

#C3D0CE#D1DFDB#E0EADD#EFF4F0#AAB8B7

Palette guide

How to use Morning Haze Dew

Overview

The Morning Haze Dew palette offers a truly gentle and ethereal color experience, perfectly capturing the serene quietude of a misty morning. Dominated by soft, muted cool tones like the airy #EFF4F0, the delicate #E0EADD, and the slightly deeper #C3D0CE, this collection evokes a sense of calm and understated elegance. Ideal for designers and developers seeking to create tranquil digital interfaces or soothing print materials, its subtle variations, including the soft blue-grey of #D1DFDB and the grounding #AAB8B7, allow for harmonious layering without harsh contrasts. This palette is a masterclass in creating a quiet, reflective mood.

Best used for

  • Wellness and meditation apps or websites
  • Spa and beauty product branding
  • Minimalist UI design for productivity tools
  • Wedding invitations and event stationery
  • Nature-inspired photography portfolios
  • Baby and children's product packaging

Suggested color roles

primary

#C3D0CE (Gentle base for main content areas or larger design elements, providing a subtle, stable foundation without overwhelming.)

secondary

#D1DFDB (Excellent for supporting sections, subtle dividers, or backgrounds that need a slightly different shade from the primary while maintaining harmony.)

accent

#AAB8B7 (Use sparingly for subtle emphasis on icons, interactive states, or delicate graphic elements where a touch of cool depth is desired.)

background

#EFF4F0 (The lightest tone, perfect for clean, expansive backgrounds that allow content to breathe and maintain an airy feel.)

text

For optimal readability, use a dark charcoal or near-black text color (e.g., #333333) against any of these light background shades.

Accessibility notes

  • Exercise caution when pairing colors from this palette together for text and backgrounds, as inherent low contrast can reduce readability.
  • Always ensure sufficient contrast for essential text (WCAG AA/AAA) by pairing the light palette colors with much darker text, such as a deep charcoal or black.
  • Avoid using two very similar light shades for interactive elements (e.g., buttons and their background) without clear visual cues like borders or icons.
  • Utilize contrast checker tools diligently, especially for smaller text sizes or important UI components, to prevent accessibility issues.

Recommended combinations

Misty Morning

Ideal for light, airy interfaces or backgrounds where a subtle gradient or layered effect is desired, maintaining extreme softness.

#EFF4F0 · #E0EADD · #D1DFDB

Serene Depth

A slightly more grounded combination for main content blocks, providing a gentle contrast for headings or secondary information against a very light background.

#C3D0CE · #AAB8B7 · #EFF4F0

Gentle Accents

Best for creating visual hierarchy in forms or data displays, where #AAB8B7 can subtly highlight key information against softer surrounding elements.

#D1DFDB · #AAB8B7 · #C3D0CE

CSS variables

:root {
  --morning-haze-dew-1: #C3D0CE;
  --morning-haze-dew-2: #D1DFDB;
  --morning-haze-dew-3: #E0EADD;
  --morning-haze-dew-4: #EFF4F0;
  --morning-haze-dew-5: #AAB8B7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "morning-haze-dew": {
        1: "#C3D0CE",
        2: "#D1DFDB",
        3: "#E0EADD",
        4: "#EFF4F0",
        5: "#AAB8B7",
      }
    }
  }
}

Related searches

calm color paletteserene UI colorsmisty morning aestheticsoft cool tonesminimalist nature palette

Palette colors

Hex values

Color 1#C3D0CE
·
Color 2#D1DFDB
·
Color 3#E0EADD
·
Color 4#EFF4F0
·
Color 5#AAB8B7
·

Accessibility

Contrast checker

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

Similar palettes

More like Morning Haze Dew

View all cool
Cool Mist Dawn
Gentle Lake Mist
Lake Dawn Hush
Misty Morning Haze
Misty Morning Lake
Misty Morning Shore