Back to palettes

Palette

Gentle Sky Whisper

Soft, airy hues that evoke the feeling of a vast, clear sky on a peaceful day, almost imperceptibly shifting.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gentle Sky Whisper 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 Gentle Sky Whisper.

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

Data visualization

#E0FFFF#ADD8E6#B0E0E6#87CEEB#D4F0F0

Palette guide

How to use Gentle Sky Whisper

Overview

The Gentle Sky Whisper palette offers a serene and expansive feel, ideal for designs seeking a tranquil atmosphere. Featuring soft, ethereal blues like the very light #E0FFFF and the slightly deeper #D4F0F0, alongside the classic light sky blue #ADD8E6 and #B0E0E6, this collection culminates with the vibrant yet gentle #87CEEB. Designers can leverage these hues to create airy, spacious layouts, while developers will find them perfect for clean UI elements, subtle gradients, and backgrounds that promote calm. This palette is excellent for projects that require a touch of subtlety and sophistication without being overwhelming.

Best used for

  • Tranquil website backgrounds and headers
  • Baby product branding and packaging
  • Spa and wellness app interfaces
  • Cloud computing service dashboards
  • Serene interior design visualizations
  • Minimalist digital art and illustrations

Suggested color roles

primary

Use #ADD8E6 as a foundational color for large sections or main content blocks, providing a stable yet light base.

secondary

#B0E0E6 can complement the primary, perhaps for secondary navigation or interactive elements, offering subtle variation.

accent

#87CEEB provides a slightly more saturated touch, perfect for call-to-action buttons or important highlights.

background

#E0FFFF creates an incredibly light, almost white background, ideal for maximizing visual space and readability.

text

For optimal readability, use a dark charcoal or black text against these light backgrounds.

Accessibility notes

  • Ensure sufficient contrast for text, as many colors are light; test #87CEEB against black for body text.
  • Use a dark gray or black for text on #E0FFFF and #D4F0F0 to meet WCAG AA standards.
  • Avoid placing light text directly on #ADD8E6 or #B0E0E6 without careful contrast checking.
  • Consider using #87CEEB for larger headings if paired with a very dark background to ensure visibility.

Recommended combinations

Sky Gradient

Ideal for subtle background gradients or layered visual effects, evoking depth.

#E0FFFF · #D4F0F0 · #ADD8E6

Calm Focus

A light base with a clear accent, suitable for headers, cards, or interactive states.

#ADD8E6 · #87CEEB · #E0FFFF

Soft Transitions

Excellent for UI elements that require gentle visual separation or hover effects.

#B0E0E6 · #D4F0F0 · #E0FFFF

CSS variables

:root {
  --gentle-sky-whisper-1: #E0FFFF;
  --gentle-sky-whisper-2: #ADD8E6;
  --gentle-sky-whisper-3: #B0E0E6;
  --gentle-sky-whisper-4: #87CEEB;
  --gentle-sky-whisper-5: #D4F0F0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gentle-sky-whisper": {
        1: "#E0FFFF",
        2: "#ADD8E6",
        3: "#B0E0E6",
        4: "#87CEEB",
        5: "#D4F0F0",
      }
    }
  }
}

Related searches

light blue color schemescalm pastel paletteserene web design colorsairy ui colorstranquil blue hues

Palette colors

Hex values

Color 1#E0FFFF
·
Color 2#ADD8E6
·
Color 3#B0E0E6
·
Color 4#87CEEB
·
Color 5#D4F0F0
·

Accessibility

Contrast checker

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

Similar palettes

More like Gentle Sky Whisper

View all pastel
Azure Dream Canvas
Celestial Cloud Shimmer
Cloudless Sky Wash
Dawn Haze Horizon
Dawn Serenity
Dreamy Cloud Haze