Back to palettes

Palette

Cherry Blossom Cloud

Delicate, airy pinks capturing the ethereal beauty of cherry blossoms in full bloom, like a cloud.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#fff0f0#ffe0e0#ffc7c7#ffadad#ff9494

Palette guide

How to use Cherry Blossom Cloud

Overview

The Cherry Blossom Cloud palette offers a delicate, monochromatic range of pinks, perfectly capturing the ethereal beauty of blossoms in full bloom. From the almost white #fff0f0 to the soft #ffe0e0, and deepening through #ffc7c7, #ffadad, to the more pronounced #ff9494, this palette provides a harmonious and airy feel. It's an excellent choice for designers seeking to evoke calm, purity, and gentle sophistication. Ideal for minimalist aesthetics, wedding themes, or any project requiring a subtle yet impactful feminine touch in branding or digital design.

Best used for

  • Minimalist wedding stationery
  • Soft feminine branding
  • Baby product design
  • Spa and wellness marketing
  • Delicate floral illustrations
  • Clean website layouts

Suggested color roles

primary

#ffc7c7 - A balanced, soft pink, suitable for main sections, large headers, or primary UI elements to establish a gentle tone.

secondary

#ffe0e0 - A lighter, supportive pink ideal for subheadings, background accents, or secondary content blocks.

accent

#ff9494 - The deepest pink, perfect for drawing subtle attention to interactive elements, highlights, or decorative flourishes.

background

#fff0f0 - The lightest, almost white shade, offering a clean, airy canvas that enhances readability and maintains a delicate aesthetic.

text

A soft charcoal grey provides excellent readability against the lighter pinks, ensuring legibility without harsh contrast.

Accessibility notes

  • Ensure good contrast when using #ff9494 for text against the lightest backgrounds like #fff0f0.
  • Avoid using #ffe0e0 or #ffc7c7 for small body text on white or near-white backgrounds due to low contrast.
  • For optimal readability, pair a dark grey or black text with #fff0f0 or #ffe0e0 backgrounds.
  • Reserve the lightest shades for backgrounds or large decorative elements, not critical informational text.

Recommended combinations

Airy Layers

Create subtle, layered backgrounds or soft visual textures, providing gentle depth and a clean feel.

#FFF0F0 · #FFE0E0 · #FFC7C7

Soft Contrast

Use #fff0f0 as background, #ffc7c7 for main content, and #ff9494 for gentle accents or calls-to-action.

#FFF0F0 · #FFC7C7 · #FF9494

Monochromatic Depth

Excellent for creating visual hierarchy within illustrations or complex UI elements, moving from light to darker pink.

#FFE0E0 · #FFADAD · #FF9494

CSS variables

:root {
  --cherry-blossom-cloud-4-1: #fff0f0;
  --cherry-blossom-cloud-4-2: #ffe0e0;
  --cherry-blossom-cloud-4-3: #ffc7c7;
  --cherry-blossom-cloud-4-4: #ffadad;
  --cherry-blossom-cloud-4-5: #ff9494;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cherry-blossom-cloud-4": {
        1: "#fff0f0",
        2: "#ffe0e0",
        3: "#ffc7c7",
        4: "#ffadad",
        5: "#ff9494",
      }
    }
  }
}

Related searches

monochromatic pink palettesoft blush color schemedelicate cherry blossom huesairy pastel pinksminimalist feminine colors

Palette colors

Hex values

Color 1#fff0f0
·
Color 2#ffe0e0
·
Color 3#ffc7c7
·
Color 4#ffadad
·
Color 5#ff9494
·

Accessibility

Contrast checker

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

Similar palettes

More like Cherry Blossom Cloud

View all pastel