Back to palettes

Palette

Misty Alpine Heights

A serene palette of cool greys and icy blues, inspired by fog-shrouded alpine peaks and crisp air.

coolcalm5 colors
More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Misty Alpine Heights 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 Alpine Heights.

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

Data visualization

#708090#A9A9A9#B0C4DE#E0FFFF#F5F5F5

Palette guide

How to use Misty Alpine Heights

Overview

The "Misty Alpine Heights" palette offers a sophisticated blend of cool greys and icy blues, perfectly capturing the crisp, serene atmosphere of fog-shrouded mountain peaks. Anchored by the grounding #708090 and the versatile #A9A9A9, it gracefully transitions to the calming #B0C4DE. The palette is brightened by the almost pure white of #F5F5F5 and the ethereal #E0FFFF, providing a clean, expansive feel. Designers and developers will find this palette ideal for creating interfaces and branding that exude luxury, professionalism, and a quiet elegance, making it suitable for high-end digital experiences and print materials seeking a modern, understated appeal.

Best used for

  • Luxury brand websites and apps
  • High-tech product interfaces
  • Spa and wellness industry branding
  • Minimalist architectural portfolios
  • Sophisticated corporate identities
  • Winter sports apparel design

Suggested color roles

primary

Utilize #708090 as the primary color for robust headings, navigation, or key interactive elements, providing a strong anchor.

secondary

Employ #B0C4DE for supporting content blocks, subheadings, or secondary UI elements to maintain a harmonious cool flow.

accent

Use #A9A9A9 for subtle accents, outlines, or decorative elements that require a metallic or understated highlight.

background

Designate #F5F5F5 as the main background color, offering a clean, almost white canvas that enhances readability and spaciousness.

text

For clear readability on light backgrounds like #F5F5F5 and #E0FFFF, use #708090 or a deep charcoal. For darker elements, consider white text.

Accessibility notes

  • Ensure #708090 text on #F5F5F5 background meets WCAG AA contrast requirements.
  • Avoid using #A9A9A9 for small body text on light backgrounds due to potentially insufficient contrast.
  • Test interactive elements, using #B0C4DE for hover states or outlines to provide visual feedback.
  • Reserve #E0FFFF primarily for backgrounds or large graphical elements, not critical text areas.

Recommended combinations

Elegant Base

Creates a pristine, layered background and subtle detail scheme for a luxurious, expansive feel.

#F5F5F5 · #E0FFFF · #A9A9A9

Clear Read

Ideal for primary content, ensuring strong readability with a cool, professional aesthetic.

#708090 · #B0C4DE · #F5F5F5

Icy Contrast

Effective for data visualization, infographics, or sections needing a balanced progression of cool tones.

#A9A9A9 · #B0C4DE · #708090

CSS variables

:root {
  --misty-alpine-heights-1: #708090;
  --misty-alpine-heights-2: #A9A9A9;
  --misty-alpine-heights-3: #B0C4DE;
  --misty-alpine-heights-4: #E0FFFF;
  --misty-alpine-heights-5: #F5F5F5;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "misty-alpine-heights": {
        1: "#708090",
        2: "#A9A9A9",
        3: "#B0C4DE",
        4: "#E0FFFF",
        5: "#F5F5F5",
      }
    }
  }
}

Related searches

cool grey blue palettesophisticated UI colorsmisty mountain designclean icy tonesluxury minimalist colors

Palette colors

Hex values

Color 1#708090
·
Color 2#A9A9A9
·
Color 3#B0C4DE
·
Color 4#E0FFFF
·
Color 5#F5F5F5
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.3:1Fail
3.8:1AA18
3.7:1AA18
2
1.7:1Fail
1.3:1Fail
2.2:1Fail
2.2:1Fail
3
2.3:1Fail
1.3:1Fail
1.7:1Fail
1.6:1Fail
4
3.8:1AA18
2.2:1Fail
1.7:1Fail
1:1Fail
5
3.7:1AA18
2.2:1Fail
1.6:1Fail
1:1Fail

Similar palettes

More like Misty Alpine Heights

View all cool
Cloud Capped Peaks
Misty Alpine Dawn
Misty Alpine Peak
Alpine Mist
Cloud Peak Summit
Fjord Mist Ascent