Palette

Cherry Blossom Whispers

Soft, romantic pinks inspired by the gentle flutter of cherry blossom petals.

pastelcalm5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cherry Blossom Whispers 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 Cherry Blossom Whispers.

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

Data visualization

#FAD7DD#F8B7BF#F28994#E05C6B#BB3644

Palette guide

How to use Cherry Blossom Whispers

Overview

The Cherry Blossom Whispers palette offers soft, romantic pinks inspired by the gentle flutter of cherry blossom petals. Ranging from the light #FAD7DD to the deeper #BB3644, and including #F8B7BF, #F28994, and #E05C6B, this palette provides a harmonious gradient of romantic pink-red tones. It's an excellent choice for designers seeking to evoke calm, romance, and gentle sophistication with a powerful accent. Ideal for elegant branding, digital art, or user interfaces where a soft, inviting, yet impactful aesthetic is desired, ensuring a comforting user experience across diverse design elements.

Best used for

Romantic wedding stationery
High-end cosmetic branding
Feminine fashion editorial
Spa and wellness retreat branding
Delicate digital illustrations
Soft lifestyle photography

Suggested color roles

primary

#F28994 - A balanced mid-pink, excellent for primary branding elements, headers, or main content blocks, offering soft prominence.

secondary

#F8B7BF - A lighter, supportive pink ideal for subheadings, background textures, or secondary UI elements to maintain softness.

accent

#BB3644 - The deepest, most vibrant pink-red in the palette, perfect for calls-to-action, important icons, or impactful decorative details.

background

#FAD7DD - The lightest, almost white pink, providing an airy, clean canvas that allows other colors to softly emerge.

text

A deep, rich charcoal grey ensures optimal readability and a sophisticated contrast against the delicate pinks, avoiding harshness.

Accessibility notes

Ensure sufficient contrast for text when using #BB3644 or #E05C6B on very light backgrounds like #FAD7DD.
Avoid using #F8B7BF or #FAD7DD for small text on near-white backgrounds due to low contrast.
For body text, a dark grey or black on #FAD7DD or #F8B7BF will offer the best readability.
Reserve the lightest shades for backgrounds or large decorative elements, not critical informational text.

Recommended combinations

Whisper Gradient

Ideal for subtle background gradients or layered graphic elements, creating a gentle, flowing visual effect.

#FAD7DD · #F8B7BF · #F28994

Romantic Contrast

Use #FAD7DD as a clean background, #F28994 for main content, and #BB3644 for impactful calls-to-action or highlights.

#FAD7DD · #F28994 · #BB3644

Deep Bloom

Excellent for creating visual depth in illustrations or complex UI components, progressing from soft to deep pink-red.

#F8B7BF · #E05C6B · #BB3644

CSS variables

:root {
  --cherry-blossom-whispers-2-1: #FAD7DD;
  --cherry-blossom-whispers-2-2: #F8B7BF;
  --cherry-blossom-whispers-2-3: #F28994;
  --cherry-blossom-whispers-2-4: #E05C6B;
  --cherry-blossom-whispers-2-5: #BB3644;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cherry-blossom-whispers-2": {
        1: "#FAD7DD",
        2: "#F8B7BF",
        3: "#F28994",
        4: "#E05C6B",
        5: "#BB3644",
      }
    }
  }
}

Hex values

Color 1#FAD7DD

Color 2#F8B7BF

Color 3#F28994

Color 4#E05C6B

Color 5#BB3644

Accessibility

Contrast checker

1.3:1Fail

1.8:1Fail

2.7:1Fail

4.3:1AA18

1.3:1Fail

1.4:1Fail

2.1:1Fail

3.4:1AA18

1.8:1Fail

1.4:1Fail

1.5:1Fail

2.4:1Fail