Palette

Cloudy Dawn Whisper

A tranquil palette reflecting the soft, muted tones of a misty morning as dawn breaks over the horizon, gentle and calm.

coolcalm5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cloudy Dawn Whisper 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 Cloudy Dawn Whisper.

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

Data visualization

#D3D3D3#C0C0C0#BCC6CC#F5F5F5#8D99AE

Palette guide

How to use Cloudy Dawn Whisper

Overview

The Cloudy Dawn Whisper palette is a tranquil collection reflecting the soft, muted tones of a misty morning as dawn breaks. Featuring gentle grays like #D3D3D3 and #C0C0C0, alongside the subtle blue-grey of #BCC6CC, and the crisp near-white of #F5F5F5, this palette evokes a calm and ethereal mood. The grounding presence of #8D99AE adds a touch of cool sophistication. Designers will find these hex codes perfect for creating serene digital experiences, understated branding, or soothing print materials. Developers can leverage these harmonious tones to build user interfaces that feel clean, spacious, and gently inviting, ideal for a peaceful aesthetic.

Best used for

wellness and meditation apps
minimalist interior design
fine art photography websites
eco-conscious brands
personal blogs with a calm aesthetic
morning routine applications

Suggested color roles

primary

#BCC6CC - A soft, cool blue-grey, serving as a gentle primary for headings or prominent elements.

secondary

#C0C0C0 - A versatile mid-tone grey, excellent for subheadings, borders, or secondary information.

accent

#8D99AE - A deeper, more saturated blue-grey, ideal for subtle accents, important icons, or a touch of grounding contrast.

background

#F5F5F5 - The lightest shade (White Smoke), providing a clean, crisp, and expansive canvas.

text

#8D99AE - This deep blue-grey offers good readability for body text against the lighter backgrounds like #F5F5F5 or #D3D3D3.

Accessibility notes

Text in #8D99AE on backgrounds like #F5F5F5 or #D3D3D3 should meet WCAG AA contrast standards.
Avoid using lighter shades like #BCC6CC or #C0C0C0 for small text on #D3D3D3 or #F5F5F5 due to potential low contrast.
Ensure interactive elements have clear visual feedback beyond just color, given the subtle variations.
Always verify contrast ratios for all text and interactive elements, particularly for critical information.

Recommended combinations

Misty Layers

For creating soft, layered backgrounds or subtle dividers in a tranquil interface, mimicking morning mist.

#F5F5F5 · #D3D3D3 · #C0C0C0

Dawn Depth

To introduce a gentle depth and highlight elements against a clean, light canvas.

#8D99AE · #BCC6CC · #F5F5F5

Quiet Harmony

Ideal for content blocks or feature cards, maintaining a soft and harmonious visual flow with subtle differentiation.

#C0C0C0 · #D3D3D3 · #BCC6CC

CSS variables

:root {
  --cloudy-dawn-whisper-1: #D3D3D3;
  --cloudy-dawn-whisper-2: #C0C0C0;
  --cloudy-dawn-whisper-3: #BCC6CC;
  --cloudy-dawn-whisper-4: #F5F5F5;
  --cloudy-dawn-whisper-5: #8D99AE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cloudy-dawn-whisper": {
        1: "#D3D3D3",
        2: "#C0C0C0",
        3: "#BCC6CC",
        4: "#F5F5F5",
        5: "#8D99AE",
      }
    }
  }
}

Hex values

Color 1#D3D3D3

Color 2#C0C0C0

Color 3#BCC6CC

Color 4#F5F5F5

Color 5#8D99AE

Accessibility

Contrast checker

1.2:1Fail

1.4:1Fail

1.9:1Fail

1.2:1Fail

1:1Fail

1.7:1Fail

1.6:1Fail

1.2:1Fail

1:1Fail

1.6:1Fail

1.7:1Fail

1.4:1Fail

1.7:1Fail

1.6:1Fail

2.6:1Fail

1.9:1Fail

1.6:1Fail

1.7:1Fail

2.6:1Fail

Similar palettes

More like Cloudy Dawn Whisper

Cloudy Dawn Whisper

See it in context.

Ready when you are.

Built with Cloudy Dawn Whisper.

How to use Cloudy Dawn Whisper

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Misty Layers

Dawn Depth

Quiet Harmony

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Cloudy Dawn Whisper