Back to palettes

Palette

Quiet Mountain Haze

Subdued grays and blues that reflect the peaceful, misty atmosphere of high mountain peaks.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Quiet Mountain Haze 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 Quiet Mountain Haze.

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

Data visualization

#708090#A9A9A9#B0C4DE#C0C0C0#D3D3D3

Palette guide

How to use Quiet Mountain Haze

Overview

The Quiet Mountain Haze palette presents subdued grays and blues that reflect the peaceful, misty atmosphere of high mountain peaks. Ranging from the light, airy #D3D3D3 to the deep, grounding blue-grey of #708090, this collection offers a tranquil and sophisticated aesthetic. Designers can leverage these hex codes to evoke a sense of calm, vastness, and natural beauty. Developers will find the distinct yet harmonious shades, including #A9A9A9 and #B0C4DE, easy to implement for a cohesive and visually appealing user interface. This palette is ideal for projects emphasizing serenity, outdoor exploration, or minimalist design.

Best used for

  • Outdoor adventure and travel brands
  • Minimalist tech interfaces and applications
  • Tranquil home decor and lifestyle brands
  • Weather forecasting apps and environmental data visualization
  • Sophisticated corporate websites and branding
  • Photography portfolios featuring landscapes

Suggested color roles

primary

Use #A9A9A9 as a versatile, balanced mid-grey for main content areas or prominent features.

secondary

Employ #B0C4DE for supporting sections, sub-headers, or UI elements, providing a soft, cool blue-grey.

accent

Apply #708090 sparingly for strong contrasts, icons, or calls-to-action, adding significant depth and grounding.

background

The light #D3D3D3 serves as an excellent, airy background, ensuring optimal readability for darker text.

text

Utilize #708090 for primary text, offering superb legibility against lighter backgrounds like #D3D3D3.

Accessibility notes

  • Ensure #708090 text has strong contrast against #D3D3D3, meeting WCAG AA requirements for all text sizes.
  • Avoid using #C0C0C0 or #B0C4DE for small text on #D3D3D3 backgrounds; contrast may be insufficient.
  • When placing #A9A9A9 on #D3D3D3, verify contrast for readability, especially for body text.
  • For interactive elements, always check contrast ratios when combining different shades within this palette.

Recommended combinations

Peak Serenity

Creates gentle gradients or subtle background elements, mimicking distant mountain layers.

#D3D3D3 · #C0C0C0 · #A9A9A9

Mountain Shadows

Excellent for defining content blocks or cards, providing layered depth and a sophisticated feel.

#708090 · #A9A9A9 · #B0C4DE

Cloud Cover

Provides a clean, subtle look for UI elements, ensuring clarity with distinct yet harmonious contrasts.

#D3D3D3 · #B0C4DE · #708090

CSS variables

:root {
  --quiet-mountain-haze-1: #708090;
  --quiet-mountain-haze-2: #A9A9A9;
  --quiet-mountain-haze-3: #B0C4DE;
  --quiet-mountain-haze-4: #C0C0C0;
  --quiet-mountain-haze-5: #D3D3D3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "quiet-mountain-haze": {
        1: "#708090",
        2: "#A9A9A9",
        3: "#B0C4DE",
        4: "#C0C0C0",
        5: "#D3D3D3",
      }
    }
  }
}

Related searches

mountain grey palettemisty blue greyserene neutral colorscalm outdoor schemesubdued cool tones

Palette colors

Hex values

Color 1#708090
·
Color 2#A9A9A9
·
Color 3#B0C4DE
·
Color 4#C0C0C0
·
Color 5#D3D3D3
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.3:1Fail
2.2:1Fail
2.7:1Fail
2
1.7:1Fail
1.3:1Fail
1.3:1Fail
1.6:1Fail
3
2.3:1Fail
1.3:1Fail
1:1Fail
1.2:1Fail
4
2.2:1Fail
1.3:1Fail
1:1Fail
1.2:1Fail
5
2.7:1Fail
1.6:1Fail
1.2:1Fail
1.2:1Fail

Similar palettes

More like Quiet Mountain Haze

View all neutral
Dusky Cloud Blanket
Silent Harbor Mist
Coastal Driftwood Grey
Coastal Driftwood Grey
Coastal Dune Haze
Coastal Fog Blanket