Back to palettes

Palette

Whispering Meadow Mist

Gentle, cool grays evoking the quiet serenity of a meadow blanketed in soft morning mist.

NeutralCalm5 colors
More Neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Whispering Meadow 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 Whispering Meadow Mist.

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

Data visualization

#B0BEC5#CFD8DC#ECEFF1#9E9E9E#78909C

Palette guide

How to use Whispering Meadow Mist

Overview

The Whispering Meadow Mist palette offers a range of gentle, cool grays, evoking the quiet serenity of a meadow blanketed in soft morning fog. It features a mid-tone gray-blue #B0BEC5, a lighter cool gray #CFD8DC, a very light, almost off-white #ECEFF1, a neutral gray #9E9E9E, and a deeper, grounding gray-blue #78909C. This palette is perfect for designers and developers seeking to create minimalist, clean, and sophisticated digital or print experiences. Its harmonious progression of cool tones provides a versatile foundation for any project, promoting a sense of calm, professionalism, and understated elegance without sacrificing depth or visual interest.

Best used for

  • Corporate and professional website design
  • Minimalist user interface (UI/UX) projects
  • Architectural and interior design presentations
  • Tech startup branding and marketing
  • Calming and focused workspace applications
  • Editorial design for modern publications

Suggested color roles

primary

Use #B0BEC5 as a versatile mid-tone for main content panels, cards, or subtle UI elements, providing a soft, approachable feel.

secondary

Employ #CFD8DC for secondary headings, borders, or background textures, adding lightness and subtle depth.

accent

Apply #78909C for strong text, call-to-action buttons, or subtle graphical accents, providing the necessary contrast and grounding.

background

Utilize #ECEFF1 as the primary background color, creating an airy, clean, and inviting canvas for all content.

text

For optimal readability, use #78909C for body text on lighter backgrounds. A standard dark charcoal or black is also highly effective.

Accessibility notes

  • Text on very light backgrounds like #ECEFF1 must be dark enough (e.g., #78909C) to ensure readability.
  • Avoid using #CFD8DC for small text on #B0BEC5 as contrast may be insufficient for accessibility standards.
  • Ensure interactive elements have clear visual cues, as subtle color changes might not be enough for all users.
  • For headings and important information, prioritize using #78909C to guarantee high contrast and legibility.

Recommended combinations

Misty Layers

Excellent for creating subtle depth in backgrounds, hero sections, or multi-layered UI elements with a serene feel.

#ECEFF1 · #CFD8DC · #B0BEC5

Deep Mist

Ideal for content blocks, card backgrounds with dark text, or sophisticated data visualizations requiring muted depth.

#B0BEC5 · #9E9E9E · #78909C

Cool Calm

Perfect for a clean, minimalist layout with strong, readable text and supportive elements, conveying professionalism.

#ECEFF1 · #78909C · #9E9E9E

CSS variables

:root {
  --whispering-meadow-mist-1: #B0BEC5;
  --whispering-meadow-mist-2: #CFD8DC;
  --whispering-meadow-mist-3: #ECEFF1;
  --whispering-meadow-mist-4: #9E9E9E;
  --whispering-meadow-mist-5: #78909C;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "whispering-meadow-mist": {
        1: "#B0BEC5",
        2: "#CFD8DC",
        3: "#ECEFF1",
        4: "#9E9E9E",
        5: "#78909C",
      }
    }
  }
}

Related searches

cool gray palettemisty neutral colorsserene blue-gray schememinimalist calm designmodern grey tones

Palette colors

Hex values

Color 1#B0BEC5
·
Color 2#CFD8DC
·
Color 3#ECEFF1
·
Color 4#9E9E9E
·
Color 5#78909C
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.7:1Fail
1.4:1Fail
1.8:1Fail
2
1.3:1Fail
1.3:1Fail
1.9:1Fail
2.3:1Fail
3
1.7:1Fail
1.3:1Fail
2.3:1Fail
2.9:1Fail
4
1.4:1Fail
1.9:1Fail
2.3:1Fail
1.3:1Fail
5
1.8:1Fail
2.3:1Fail
2.9:1Fail
1.3:1Fail

Similar palettes

More like Whispering Meadow Mist

View all Neutral
Misty Morning Haze
Coastal Fog Morning
Clouded Moon Reflection
Foggy Pine Retreat
Pebble Shore
Pebble Shore Drift