Back to palettes

Palette

Cloud Kissed Peak

Soft, airy grays and blues that mirror the serene vista of mountain peaks meeting cloudy skies.

neutralcalm5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cloud Kissed Peak 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 Cloud Kissed Peak.

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

Data visualization

#EBEBF0#D5D5DF#BFC0CF#A8A9BF#9192AF

Palette guide

How to use Cloud Kissed Peak

Overview

The Cloud Kissed Peak palette offers soft, airy grays and blues that mirror the serene vista of mountain peaks meeting cloudy skies. Ranging from the deepest, grounding #9192AF to the delicate #EBEBF0, with subtle transitions through #A8A9BF, #BFC0CF, and #D5D5DF, this collection embodies calm and sophistication. It's an excellent choice for designers and developers aiming for a clean, minimalist, and tranquil aesthetic. Leverage these serene hues to create modern websites, understated branding, or pristine interfaces that convey elegance and professionalism, fostering a sense of peaceful ascent and natural beauty.

Best used for

  • Minimalist web interfaces
  • Outdoor adventure branding (subtle)
  • High-end tech product design
  • Architectural visualization
  • Serene corporate communications
  • Photography backdrop themes

Suggested color roles

primary

Use #9192AF as the dominant, anchoring color for main headers, navigation, or strong brand elements. It provides the deepest, most stable presence.

secondary

Employ #A8A9BF for supporting sections, subheadings, or secondary content. It offers a softer yet substantial cool grey.

accent

Apply #BFC0CF for subtle highlights, interactive states, or decorative elements. Its lighter tone provides gentle contrast and refinement.

background

Utilize #EBEBF0 for clean, expansive backgrounds. This very light, almost white-grey creates an airy, serene canvas, promoting readability.

text

For body text on light backgrounds like #EBEBF0 or #D5D5DF, #9192AF provides excellent readability. Consider a very dark charcoal (#333333) for maximum contrast if needed.

Accessibility notes

  • Ensure #9192AF text on #EBEBF0 or #D5D5DF backgrounds meets WCAG contrast standards. Other grey-on-grey combinations will likely fail.
  • Avoid using #BFC0CF or #A8A9BF text on the lighter backgrounds, as contrast will be insufficient.
  • Always use a contrast checker to verify all text and interactive element color combinations for accessibility compliance.
  • For critical text elements, consider using a very dark charcoal or black if palette colors don't provide enough contrast on the lightest shades.

Recommended combinations

Peak Shadow

Ideal for a strong, professional base. #9192AF for headers, #A8A9BF for secondary content, and #EBEBF0 as a pristine background.

#9192AF · #A8A9BF · #EBEBF0

Cloud Layers

Excellent for subtle gradients or layered UI elements, creating depth without harshness.

#BFC0CF · #D5D5DF · #A8A9BF

Summit Air

Perfect for a very light, spacious design. #A8A9BF for key text, with #D5D5DF and #EBEBF0 for layered backgrounds.

#A8A9BF · #D5D5DF · #EBEBF0

CSS variables

:root {
  --cloud-kissed-peak-1: #EBEBF0;
  --cloud-kissed-peak-2: #D5D5DF;
  --cloud-kissed-peak-3: #BFC0CF;
  --cloud-kissed-peak-4: #A8A9BF;
  --cloud-kissed-peak-5: #9192AF;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cloud-kissed-peak": {
        1: "#EBEBF0",
        2: "#D5D5DF",
        3: "#BFC0CF",
        4: "#A8A9BF",
        5: "#9192AF",
      }
    }
  }
}

Related searches

serene grey blue palettemountain mist color schemecalm neutral UI colorsminimalist grey brandingairy peak web design

Palette colors

Hex values

Color 1#EBEBF0
·
Color 2#D5D5DF
·
Color 3#BFC0CF
·
Color 4#A8A9BF
·
Color 5#9192AF
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
1.9:1Fail
2.5:1Fail
2
1.2:1Fail
1.2:1Fail
1.6:1Fail
2.1:1Fail
3
1.5:1Fail
1.2:1Fail
1.3:1Fail
1.7:1Fail
4
1.9:1Fail
1.6:1Fail
1.3:1Fail
1.3:1Fail
5
2.5:1Fail
2.1:1Fail
1.7:1Fail
1.3:1Fail

Similar palettes

More like Cloud Kissed Peak

View all neutral
Foggy Mountain Ascent
Misty Peaks Veil
Cloud Burst Horizon
Foggy River Morning
Misty Alpine Peak
Misty Mountain Trail