Back to palettes

Palette

Sakura Cloud Whisper

Delicate and ethereal pinks, capturing the fleeting beauty of cherry blossom petals drifting.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sakura Cloud 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 Sakura Cloud Whisper.

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

Data visualization

#ECCFEF#FADCF3#FFF0F5#C0A9C2#9C899E

Palette guide

How to use Sakura Cloud Whisper

Overview

The Sakura Cloud Whisper palette evokes the ethereal beauty of cherry blossom petals drifting like clouds, featuring a delicate blend of cool pinks and muted purples. It spans from the soft #ECCFEF and #FADCF3, through the almost white #FFF0F5, to the more grounded #C0A9C2 and #9C899E. This collection is perfect for designers and developers aiming to create a sense of calm, elegance, and fleeting beauty. The subtle variations in tone provide depth while maintaining a consistently serene and sophisticated aesthetic, ideal for projects requiring a gentle, dreamlike quality.

Best used for

  • Spa and wellness brand identity
  • Delicate wedding and event stationery
  • Feminine fashion and beauty blogs
  • Gentle children's product designs
  • Ethereal digital art and illustrations
  • Soft and calming UI/UX experiences

Suggested color roles

primary

Use #ECCFEF as a primary background or large area color, offering a light, airy foundation.

secondary

Employ #C0A9C2 for supporting elements like subheadings or informational panels, adding a touch of muted sophistication.

accent

Reserve #9C899E for subtle accents, icons, or hover states, providing a deeper, grounding element.

background

Utilize #FFF0F5 or #FADCF3 for clean, almost white backgrounds that enhance readability and maintain a light feel.

text

For dark text on light backgrounds, #9C899E offers good readability. A medium-dark gray or black is suitable for body text.

Accessibility notes

  • Ensure sufficient contrast for text when using any of the lighter colors as background, especially #FFF0F5.
  • Avoid pairing #ECCFEF with #FADCF3 or #FFF0F5 for text and background due to very low contrast.
  • Use #9C899E for important text or interactive elements to ensure visibility and readability.
  • Test all color combinations with an accessibility checker to meet WCAG AA standards, particularly for links and buttons.

Recommended combinations

Ethereal Flow

Ideal for subtle background gradients or soft layered elements, creating a dreamlike, seamless transition.

#FFF0F5 · #FADCF3 · #ECCFEF

Muted Elegance

Effective for main content areas, with #9C899E for headings and #C0A9C2 for supportive graphics on a light base.

#FFF0F5 · #C0A9C2 · #9C899E

Soft Contrast

Great for UI elements where #9C899E provides a grounding contrast against the lighter, delicate pinks.

#ECCFEF · #C0A9C2 · #9C899E

CSS variables

:root {
  --sakura-cloud-whisper-1: #ECCFEF;
  --sakura-cloud-whisper-2: #FADCF3;
  --sakura-cloud-whisper-3: #FFF0F5;
  --sakura-cloud-whisper-4: #C0A9C2;
  --sakura-cloud-whisper-5: #9C899E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sakura-cloud-whisper": {
        1: "#ECCFEF",
        2: "#FADCF3",
        3: "#FFF0F5",
        4: "#C0A9C2",
        5: "#9C899E",
      }
    }
  }
}

Related searches

pastel purple pink palettecherry blossom cloud colorsethereal spring color schemecalming ui design palettesoft feminine branding colors

Palette colors

Hex values

Color 1#ECCFEF
·
Color 2#FADCF3
·
Color 3#FFF0F5
·
Color 4#C0A9C2
·
Color 5#9C899E
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.3:1Fail
1.5:1Fail
2.3:1Fail
2
1.1:1Fail
1.1:1Fail
1.7:1Fail
2.6:1Fail
3
1.3:1Fail
1.1:1Fail
2:1Fail
2.9:1Fail
4
1.5:1Fail
1.7:1Fail
2:1Fail
1.5:1Fail
5
2.3:1Fail
2.6:1Fail
2.9:1Fail
1.5:1Fail

Similar palettes

More like Sakura Cloud Whisper

View all pastel
Gentle Blossom Whisper
Cherry Bloom Serenity
Cherry Blossom Bloom
Cherry Blossom Breeze
Cherry Blossom Cloud
Cherry Blossom Dawn