Back to palettes

Palette

Sakura Bloom Spring

Gentle, ethereal pinks reminiscent of cherry blossoms swaying in a soft spring breeze.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sakura Bloom Spring 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 Bloom Spring.

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

Data visualization

#FFD9E8#FFC7D8#FFB4C8#F0A0B0#E08C9A

Palette guide

How to use Sakura Bloom Spring

Overview

The Sakura Bloom Spring palette (ID: sakura-bloom-spring-2) offers gentle, ethereal pinks reminiscent of cherry blossoms swaying in a soft spring breeze. This harmonious collection moves from the light #FFD9E8 to the richer #E08C9A, creating a warm and inviting atmosphere. Key colors include #FFC7D8 and #FFB4C8, which provide lovely mid-tones, while #F0A0B0 offers a slightly more pronounced pink. This palette is exceptionally versatile for designs that aim for a fresh, romantic, or subtly feminine aesthetic. Developers and designers will find it useful for creating user interfaces, branding, or digital art that feels tranquil, approachable, and visually cohesive, evoking the promise of spring.

Best used for

  • Spring fashion or beauty brand campaigns
  • Feminine lifestyle blogs and websites
  • Wedding invitations and event decor
  • Children's clothing or toy branding
  • Soft UI themes for lifestyle apps
  • Digital illustrations with a romantic touch

Suggested color roles

primary

#FFD9E8 - A very light, soft pink, ideal as a primary background or canvas, setting a gentle and airy foundation for content.

secondary

#FFC7D8 - A slightly more saturated light pink, excellent for subheadings, subtle dividers, or hover states, maintaining the palette's softness.

accent

#E08C9A - The deepest, most vibrant pink in the palette, perfect for calls-to-action, important links, or small, impactful graphic details that need to stand out elegantly.

background

#FFD9E8 - This light, airy pink provides a fresh and clean base, ensuring excellent readability for darker text and contributing to a serene user experience.

text

For optimal readability, use a dark charcoal or black for primary text. For secondary text or decorative elements, a very dark version of #E08C9A can provide a soft, yet legible, alternative.

Accessibility notes

  • The lighter shades like #FFD9E8 and #FFC7D8 are generally too light for body text on light backgrounds; always use darker colors.
  • Ensure #F0A0B0 and #E08C9A have sufficient contrast with background colors if used for interactive elements or important text.
  • Use a contrast checker tool to verify WCAG compliance for all text and interactive elements.
  • Provide clear visual feedback for interactive states, as subtle color changes might be missed with this soft palette.

Recommended combinations

Soft Breeze

Creates an incredibly light and airy feel, perfect for minimalist backgrounds, subtle overlays, or delicate informational sections.

#FFD9E8 · #FFC7D8 · #FFB4C8

Blossom Focus

Excellent for subtly highlighting key information, form fields, or secondary calls-to-action without harsh contrasts.

#FFC7D8 · #F0A0B0 · #E08C9A

Spring Depth

Suitable for creating elegant headers, footers, or subtle branding elements that require a touch of sophisticated depth.

#FFD9E8 · #E08C9A · #F0A0B0

CSS variables

:root {
  --sakura-bloom-spring-2-1: #FFD9E8;
  --sakura-bloom-spring-2-2: #FFC7D8;
  --sakura-bloom-spring-2-3: #FFB4C8;
  --sakura-bloom-spring-2-4: #F0A0B0;
  --sakura-bloom-spring-2-5: #E08C9A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sakura-bloom-spring-2": {
        1: "#FFD9E8",
        2: "#FFC7D8",
        3: "#FFB4C8",
        4: "#F0A0B0",
        5: "#E08C9A",
      }
    }
  }
}

Related searches

gentle pink color paletteethereal spring colorssoft feminine brandingcherry blossom web designromantic pastel UI

Palette colors

Hex values

Color 1#FFD9E8
·
Color 2#FFC7D8
·
Color 3#FFB4C8
·
Color 4#F0A0B0
·
Color 5#E08C9A
·

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.1:1Fail
1.4:1Fail
1.7:1Fail
3
1.3:1Fail
1.1:1Fail
1.2:1Fail
1.5:1Fail
4
1.6:1Fail
1.4:1Fail
1.2:1Fail
1.2:1Fail
5
1.9:1Fail
1.7:1Fail
1.5:1Fail
1.2:1Fail

Similar palettes

More like Sakura Bloom Spring

View all pastel