Back to palettes

Palette

Whispering Mist

Soft, hazy grays mimicking a peaceful fog rolling over a still landscape at dawn.

monochromeminimal5 colors
More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#E8E8E8#D3D3D3#B0B0B0#8A8A8A#616161

Palette guide

How to use Whispering Mist

Overview

The Whispering Mist palette offers a sophisticated monochrome collection of grays, designed to evoke the peaceful calm of a subtle fog rolling over a still landscape. It features a very light gray #E8E8E8, a light gray #D3D3D3, a versatile mid-gray #B0B0B0, a darker gray #8A8A8A, and a deep charcoal #616161. This palette is invaluable for designers and developers seeking to create minimalist, modern, and understated digital or print experiences. Its harmonious progression of tones provides a clean, versatile foundation for any project, promoting a sense of calm, focus, and refined simplicity, perfect for professional or artistic applications.

Best used for

  • Minimalist UI/UX design
  • Modern corporate branding
  • Architectural visualization
  • Editorial design for art or tech
  • Abstract art and photography portfolios
  • Data visualization and dashboards

Suggested color roles

primary

Use #B0B0B0 as a versatile mid-tone for main content panels, cards, or subtle UI elements, providing a balanced and clean feel.

secondary

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

accent

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

background

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

text

For optimal readability, use #616161 for body text on lighter backgrounds. A standard black is also highly effective.

Accessibility notes

  • Ensure sufficient contrast for text on very light backgrounds like #E8E8E8; use #616161 or #8A8A8A.
  • Avoid using #D3D3D3 for small text on #B0B0B0 as contrast may be insufficient for accessibility standards.
  • For interactive elements, ensure they have clear visual cues beyond just subtle gray differences.
  • For headings and important information, prioritize using #616161 to guarantee high contrast and legibility.

Recommended combinations

Light Fog Layers

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

#E8E8E8 · #D3D3D3 · #B0B0B0

Deep Shadows

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

#B0B0B0 · #8A8A8A · #616161

Subtle Contrast

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

#E8E8E8 · #616161 · #8A8A8A

CSS variables

:root {
  --whispering-mist-1: #E8E8E8;
  --whispering-mist-2: #D3D3D3;
  --whispering-mist-3: #B0B0B0;
  --whispering-mist-4: #8A8A8A;
  --whispering-mist-5: #616161;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "whispering-mist": {
        1: "#E8E8E8",
        2: "#D3D3D3",
        3: "#B0B0B0",
        4: "#8A8A8A",
        5: "#616161",
      }
    }
  }
}

Related searches

monochrome gray palettesubtle neutral colorsminimalist fog schememodern gray tonescalm grayscale design

Palette colors

Hex values

Color 1#E8E8E8
·
Color 2#D3D3D3
·
Color 3#B0B0B0
·
Color 4#8A8A8A
·
Color 5#616161
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.8:1Fail
2.8:1Fail
5.1:1AA
2
1.2:1Fail
1.4:1Fail
2.3:1Fail
4.1:1AA18
3
1.8:1Fail
1.4:1Fail
1.6:1Fail
2.9:1Fail
4
2.8:1Fail
2.3:1Fail
1.6:1Fail
1.8:1Fail
5
5.1:1AA
4.1:1AA18
2.9:1Fail
1.8:1Fail

Similar palettes

More like Whispering Mist

View all monochrome
Ghostly Fog Hues
Monochromatic Mist
Pale Stone Serenity
Calm Stone Meditate
Charcoal Sketchbook Grey
Cloud Grey Mirage