Back to palettes

Palette

Open Sky Horizon

Expansive and calming, this palette reflects the wide-open spaces of a clear sky and distant horizon.

CoolCalm5 colors
More Cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Open Sky Horizon 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 Open Sky Horizon.

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

Data visualization

#A9D4E1#C2E2EB#8ABDCB#6D9EAE#DEEEF4

Palette guide

How to use Open Sky Horizon

Overview

The Open Sky Horizon palette is an expansive and calming collection that reflects the wide-open spaces of a clear sky and distant horizon. Featuring serene blues like #A9D4E1, #C2E2EB, #8ABDCB, #6D9EAE, and #DEEEF4, this palette is perfect for designers and developers creating airy, refreshing, and reliable digital experiences. Its cool, inviting tones are ideal for travel brands, cloud-based services, and content that evokes freedom, clarity, and trust, ensuring a clear and harmonious visual presence.

Best used for

  • Travel and tourism brands
  • Cloud-based software interfaces
  • Aviation or aerospace companies
  • Wellness and mindfulness apps
  • Outdoor lifestyle marketing
  • Educational platforms and resources

Suggested color roles

primary

#8ABDCB (a medium sky blue) is ideal for main headings, brand elements, or prominent feature sections, conveying clarity.

secondary

#A9D4E1 (a lighter, soft sky blue) works well for sub-sections, navigation, or secondary text, providing gentle visual separation.

accent

#6D9EAE (a deeper, muted blue) can be used for important calls to action, interactive states, or subtle borders, adding a sense of reliability.

background

#DEEEF4 or #C2E2EB (very light, airy blue tones) creates clean, expansive page backgrounds, perfect for an open and refreshing feel.

text

#6D9EAE provides good contrast for dark text on light backgrounds like #DEEEF4, or opt for a dark blue/charcoal for optimal readability.

Accessibility notes

  • Ensure #6D9EAE text on #DEEEF4 background meets WCAG AA contrast standards for optimal readability.
  • Lighter blues like #A9D4E1 might not have enough contrast for small text on #DEEEF4, so use with caution.
  • Use the darker shades, especially #6D9EAE, for critical text and interactive elements to ensure clarity and visibility.
  • Avoid pairing very light blues for both text and background to prevent readability issues and improve user experience.

Recommended combinations

Clear Sky Base

Creates an airy, open, and inviting atmosphere for web pages or large background areas, promoting serenity.

#DEEEF4 · #C2E2EB · #A9D4E1

Horizon Depth

For strong headings, feature sections, or calls to action, providing visual weight and contrast.

#8ABDCB · #6D9EAE · #DEEEF4

Cloud Layer

Ideal for subtle visual hierarchy, distinct UI components, or layered information displays.

#A9D4E1 · #C2E2EB · #6D9EAE

CSS variables

:root {
  --open-sky-horizon-1: #A9D4E1;
  --open-sky-horizon-2: #C2E2EB;
  --open-sky-horizon-3: #8ABDCB;
  --open-sky-horizon-4: #6D9EAE;
  --open-sky-horizon-5: #DEEEF4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "open-sky-horizon": {
        1: "#A9D4E1",
        2: "#C2E2EB",
        3: "#8ABDCB",
        4: "#6D9EAE",
        5: "#DEEEF4",
      }
    }
  }
}

Related searches

clear sky blue paletteserene cool colorsopen space design themehorizon blue schemecalming light blue green

Palette colors

Hex values

Color 1#A9D4E1
·
Color 2#C2E2EB
·
Color 3#8ABDCB
·
Color 4#6D9EAE
·
Color 5#DEEEF4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.3:1Fail
1.8:1Fail
1.3:1Fail
2
1.2:1Fail
1.5:1Fail
2.1:1Fail
1.1:1Fail
3
1.3:1Fail
1.5:1Fail
1.4:1Fail
1.7:1Fail
4
1.8:1Fail
2.1:1Fail
1.4:1Fail
2.5:1Fail
5
1.3:1Fail
1.1:1Fail
1.7:1Fail
2.5:1Fail

Similar palettes

More like Open Sky Horizon

View all Cool