Back to palettes

Palette

Sakura Petal Breeze

A gradient of delicate pinks, from whisper-soft to deep bloom, inspired by cherry blossom petals dancing in the wind.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sakura Petal Breeze 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 Petal Breeze.

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

Data visualization

#FFD1DC#F8BBD0#F06292#E91E63#C2185B

Palette guide

How to use Sakura Petal Breeze

Overview

The Sakura Petal Breeze palette (ID: sakura-petal-breeze-2) offers a vibrant and dynamic gradient of pinks, from whisper-soft to deeply saturated, reflecting cherry blossom petals dancing in the wind. This collection features a delicate #FFD1DC and #F8BBD0, transitioning into more assertive tones like #F06292 and #E91E63, and culminating in the rich #C2185B. It's a versatile palette for designers seeking to convey energy, romance, and vibrancy with a floral touch. The range allows for creating impactful visual hierarchies and expressive designs that demand attention while retaining a sophisticated, natural feel.

Best used for

  • Youthful and energetic branding
  • Fashion and beauty product campaigns
  • Event and party invitations
  • Dynamic digital illustrations and UI
  • Sports or fitness brand accents
  • Bold feminine blogs and websites

Suggested color roles

primary

#E91E63 (Vibrant Rose) commands attention as a primary brand color, conveying energy and passion.

secondary

#F06292 (Deep Pink) acts as a dynamic secondary, excellent for headings, calls-to-action, or key visual elements.

accent

#FFD1DC (Soft Petal) offers a gentle highlight, perfect for interactive states or subtle background textures.

background

#F8BBD0 (Light Blush) provides a soft, inviting canvas that allows the deeper pinks to truly pop.

text

Utilize #C2185B (Dark Raspberry) for striking headlines and critical body text on lighter backgrounds, ensuring high contrast and impact. For lighter text on darker backgrounds, a crisp white is recommended.

Accessibility notes

  • Ensure sufficient contrast when using #FFD1DC or #F8BBD0 for text on light backgrounds; they are best for backgrounds or large graphics.
  • The darker shades #E91E63 and #C2185B offer excellent contrast for white or light-colored text.
  • Avoid using #F8BBD0 as text on #FFD1DC without a very large font size and bold weight.
  • Prioritize #E91E63 or #C2185B for essential text against light backgrounds to meet accessibility standards.

Recommended combinations

Energetic Bloom

Creates a bold, high-contrast look, ideal for branding logos, impactful headlines, or call-to-action buttons.

#E91E63 · #C2185B · #F8BBD0

Petal Dance

Perfect for lively illustrations, hero sections, or a cheerful, inviting user interface with a gradient feel.

#F06292 · #FFD1DC · #F8BBD0

Vibrant Transition

Excellent for creating dramatic gradients, background patterns, or visual depth in digital artwork and infographics.

#C2185B · #E91E63 · #F06292

CSS variables

:root {
  --sakura-petal-breeze-2-1: #FFD1DC;
  --sakura-petal-breeze-2-2: #F8BBD0;
  --sakura-petal-breeze-2-3: #F06292;
  --sakura-petal-breeze-2-4: #E91E63;
  --sakura-petal-breeze-2-5: #C2185B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sakura-petal-breeze-2": {
        1: "#FFD1DC",
        2: "#F8BBD0",
        3: "#F06292",
        4: "#E91E63",
        5: "#C2185B",
      }
    }
  }
}

Related searches

vibrant pink color schemedynamic cherry blossom palettebold floral design colorsenergetic blush web palettemodern feminine color combination

Palette colors

Hex values

Color 1#FFD1DC
·
Color 2#F8BBD0
·
Color 3#F06292
·
Color 4#E91E63
·
Color 5#C2185B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
2.2:1Fail
3.2:1AA18
4.3:1AA18
2
1.2:1Fail
1.9:1Fail
2.7:1Fail
3.6:1AA18
3
2.2:1Fail
1.9:1Fail
1.4:1Fail
1.9:1Fail
4
3.2:1AA18
2.7:1Fail
1.4:1Fail
1.4:1Fail
5
4.3:1AA18
3.6:1AA18
1.9:1Fail
1.4:1Fail

Similar palettes

More like Sakura Petal Breeze

View all pastel