Palette

Foggy Mountain Ascent

Soft, muted grays and whites depicting the serene, mysterious atmosphere of mist-shrouded peaks.

neutralcalm5 colors

More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Foggy Mountain Ascent 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 Foggy Mountain Ascent.

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

Data visualization

#708090#A9A9A9#B0C4DE#C0C0C0#DCDCDC

Palette guide

How to use Foggy Mountain Ascent

Overview

The Foggy Mountain Ascent palette, with its soft, muted grays and blues, depicts the serene, mysterious atmosphere of mist-shrouded peaks. This neutral collection, ranging from slate grey #708090 to off-white #DCDCDC, is perfect for conveying calm, elegance, and a sense of quiet grandeur. Designers and developers can leverage these harmonious tones to build minimalist interfaces, sophisticated branding, or evocative digital landscapes. The subtle shifts between shades provide depth and tranquility, making it ideal for projects that aim for a refined, understated, and timeless aesthetic.

Best used for

Outdoor adventure and exploration brands
Minimalist interior design concepts
Meditation and mindfulness apps
Photography and art portfolios
Corporate websites with a calm, professional feel
Sustainable and eco-friendly product branding

Suggested color roles

primary

Use #708090 for main content, strong typography, or foundational elements to provide a grounding presence.

secondary

Apply #A9A9A9 for supporting text, navigation, or subtle dividers, offering a gentle contrast.

accent

Utilize #B0C4DE for soft highlights, interactive states, or delicate graphical details, introducing a touch of cool blue.

background

The very light #DCDCDC serves as an excellent primary background, creating a clean, airy, and expansive canvas.

text

#708090 or a true charcoal provides optimal readability on lighter backgrounds like #DCDCDC or #C0C0C0.

Accessibility notes

Ensure sufficient contrast for text, especially when pairing lighter shades like #C0C0C0 on #DCDCDC.
For critical information, use darker text colors such as #708090 against the lightest backgrounds.
Avoid using mid-tone colors for small text on similarly toned backgrounds, as readability may suffer.
Provide ample spacing and clear typography to enhance readability within this subtle palette.

Recommended combinations

Peak Mist

For creating a light, ethereal feel, perfect for header areas or clean UI elements.

#DCDCDC · #C0C0C0 · #B0C4DE

Mountain Depth

Ideal for layered designs, adding depth to sections while maintaining a serene atmosphere.

#708090 · #A9A9A9 · #B0C4DE

Serene Ascent

A smooth gradient for backgrounds or large sections, conveying a gentle and calming transition.

#A9A9A9 · #C0C0C0 · #DCDCDC

CSS variables

:root {
  --foggy-mountain-ascent-2-1: #708090;
  --foggy-mountain-ascent-2-2: #A9A9A9;
  --foggy-mountain-ascent-2-3: #B0C4DE;
  --foggy-mountain-ascent-2-4: #C0C0C0;
  --foggy-mountain-ascent-2-5: #DCDCDC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "foggy-mountain-ascent-2": {
        1: "#708090",
        2: "#A9A9A9",
        3: "#B0C4DE",
        4: "#C0C0C0",
        5: "#DCDCDC",
      }
    }
  }
}

Hex values

Color 1#708090

Color 2#A9A9A9

Color 3#B0C4DE

Color 4#C0C0C0

Color 5#DCDCDC

Accessibility

Contrast checker

1.7:1Fail

2.3:1Fail

2.2:1Fail

3:1Fail

1.7:1Fail

1.3:1Fail

1.7:1Fail

2.3:1Fail

1.3:1Fail

1:1Fail

1.3:1Fail

2.2:1Fail

1.3:1Fail

1:1Fail

1.3:1Fail

3:1Fail

1.7:1Fail

1.3:1Fail

Similar palettes

More like Foggy Mountain Ascent

Foggy Mountain Ascent

See it in context.

Ready when you are.

Built with Foggy Mountain Ascent.

How to use Foggy Mountain Ascent

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Peak Mist

Mountain Depth

Serene Ascent

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Foggy Mountain Ascent