Back to palettes

Palette

Misty Mountain Spring

Soft, cool tones reflecting a misty mountain landscape in early spring, touched with fresh greens and hazy skies.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Misty Mountain Spring 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 Misty Mountain Spring.

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

Data visualization

#A9B7C7#CBD7E0#E0E8F0#9EC6AA#B9D7C1

Palette guide

How to use Misty Mountain Spring

Overview

The Misty Mountain Spring palette evokes the serene beauty of a high-altitude landscape emerging from winter. Dominated by cool, muted blues and greens, this collection offers a tranquil and refreshing aesthetic. Key colors include the soft, atmospheric blue-grey #A9B7C7, a lighter, almost ethereal #CBD7E0, and the crisp, clean #E0E8F0, reminiscent of misty skies or fresh snow. These are beautifully complemented by the gentle, verdant greens of #9EC6AA and #B9D7C1, reflecting new growth and distant foliage. Ideal for projects seeking a calm, airy, and sophisticated feel, this palette provides a harmonious foundation for both digital and print designs, ensuring a cohesive and inviting user experience.

Best used for

  • Wellness and spa branding
  • Nature-themed websites and apps
  • Eco-friendly product packaging
  • Serene interior design concepts
  • Baby and children's apparel
  • Photography portfolios (landscape, fine art)

Suggested color roles

primary

#A9B7C7 - A grounding, muted blue-grey, excellent for large UI sections, hero backgrounds, or core branding elements where a calm, professional tone is desired.

secondary

#CBD7E0 - A lighter, airy blue-grey that pairs well with the primary, suitable for secondary panels, card backgrounds, or subtle navigation elements.

accent

#9EC6AA - A soft, fresh green providing a gentle pop of color, perfect for interactive elements like buttons, icons, or subtle highlights without being overwhelming.

background

#E0E8F0 - A very light, almost white blue-grey, serving as a clean, expansive canvas for content, ensuring readability and an open feel.

text

For body text, consider a dark charcoal or near-black for optimal readability against lighter backgrounds like #E0E8F0. For larger headings or specific emphasis on lighter backgrounds, #A9B7C7 can be effective.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using lighter palette colors like #CBD7E0 or #B9D7C1 for text on light backgrounds.
  • Pair dark text (e.g., charcoal or black) with #E0E8F0 for excellent readability, meeting WCAG AA standards.
  • Use #A9B7C7 or #9EC6AA as accent colors for interactive elements, ensuring they are distinct enough from background colors for visual clarity.
  • Avoid using #B9D7C1 directly on #E0E8F0 for small text; the contrast will be insufficient for most users.

Recommended combinations

Misty Dawn

Ideal for clean, minimalist layouts, corporate websites, or subtle background gradients that need to feel expansive and light.

#E0E8F0 · #CBD7E0 · #A9B7C7

Spring Ascent

Excellent for nature-inspired designs, health and wellness apps, or branding that emphasizes growth and tranquility.

#A9B7C7 · #9EC6AA · #E0E8F0

Forest Whisper

Suited for soft, inviting interfaces, children's products, or artistic portfolios where a gentle, organic feel is paramount.

#CBD7E0 · #B9D7C1 · #A9B7C7

CSS variables

:root {
  --misty-mountain-spring-1: #A9B7C7;
  --misty-mountain-spring-2: #CBD7E0;
  --misty-mountain-spring-3: #E0E8F0;
  --misty-mountain-spring-4: #9EC6AA;
  --misty-mountain-spring-5: #B9D7C1;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "misty-mountain-spring": {
        1: "#A9B7C7",
        2: "#CBD7E0",
        3: "#E0E8F0",
        4: "#9EC6AA",
        5: "#B9D7C1",
      }
    }
  }
}

Related searches

pastel mountain color schemecalm spring palettemisty landscape colorsairy green blue palettesoft nature inspired colors

Palette colors

Hex values

Color 1#A9B7C7
·
Color 2#CBD7E0
·
Color 3#E0E8F0
·
Color 4#9EC6AA
·
Color 5#B9D7C1
·

Accessibility

Contrast checker

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

Similar palettes

More like Misty Mountain Spring

View all pastel
Fresh Spring Breeze
Meadow Spring Fresh
Aqua Glimmer Dew
Blooming Garden Sprig
Blooming Meadow Softness
Botanical Bloom Fresh