Back to palettes

Palette

Sakura Blossom Dawn

Delicate pinks of cherry blossoms at sunrise, radiating a gentle and hopeful warmth.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sakura Blossom Dawn 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 Blossom Dawn.

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

Data visualization

#FADADD#F3C4D1#E8A7BB#C982A1#B26C8D

Palette guide

How to use Sakura Blossom Dawn

Overview

The Sakura Blossom Dawn palette captures the essence of cherry blossoms bathed in the first light of day, offering a gradient of soft, inviting pinks. It transitions from the airy lightness of #FADADD, through the gentle warmth of #F3C4D1 and the elegant #E8A7BB, to the deeper, more grounded tones of #C982A1 and #B26C8D. This collection of hues is perfect for designers and developers aiming to create experiences that feel tender, hopeful, and subtly playful. The distinct yet harmonious shades provide ample versatility for various design applications, from digital interfaces to print media.

Best used for

  • Children's apparel or toy branding
  • Feminine lifestyle and wellness apps
  • Spring-themed marketing campaigns
  • Delicate textile and pattern designs
  • Romantic event branding and decor
  • Soft and inviting UI/UX themes

Suggested color roles

primary

Use #E8A7BB as a welcoming primary color for main sections or prominent graphic elements.

secondary

Employ #C982A1 for supporting accents, subheadings, or secondary buttons, providing depth without overwhelming.

accent

Reserve #B26C8D for critical calls-to-action or important highlights, offering a sophisticated anchor.

background

Utilize #FADADD or #F3C4D1 for light, airy backgrounds that enhance readability and maintain a gentle mood.

text

For dark text, #B26C8D offers excellent readability on lighter backgrounds. A charcoal gray or black works for standard body text.

Accessibility notes

  • Ensure sufficient contrast for text, especially when using #FADADD or #F3C4D1 as background colors.
  • Avoid pairing #FADADD with #F3C4D1 for text and background due to minimal contrast.
  • Use #B26C8D for important text elements to ensure readability against lighter palette colors.
  • Verify contrast ratios for interactive elements against their backgrounds to meet WCAG AA standards.

Recommended combinations

Gentle Bloom

Ideal for soft gradients in hero sections or background elements, creating a seamless, airy feel.

#FADADD · #F3C4D1 · #E8A7BB

Playful Accent

Effective for main content blocks, with #B26C8D for headings and #C982A1 for supportive graphics.

#F3C4D1 · #C982A1 · #B26C8D

Deep Blush

Perfect for high-contrast UI elements, where #B26C8D provides strong calls-to-action against a light backdrop.

#FADADD · #C982A1 · #B26C8D

CSS variables

:root {
  --sakura-blossom-dawn-1: #FADADD;
  --sakura-blossom-dawn-2: #F3C4D1;
  --sakura-blossom-dawn-3: #E8A7BB;
  --sakura-blossom-dawn-4: #C982A1;
  --sakura-blossom-dawn-5: #B26C8D;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sakura-blossom-dawn": {
        1: "#FADADD",
        2: "#F3C4D1",
        3: "#E8A7BB",
        4: "#C982A1",
        5: "#B26C8D",
      }
    }
  }
}

Related searches

soft pink color palettecherry blossom branding colorspastel sunrise color schemedelicate ui ux colorsromantic spring web colors

Palette colors

Hex values

Color 1#FADADD
·
Color 2#F3C4D1
·
Color 3#E8A7BB
·
Color 4#C982A1
·
Color 5#B26C8D
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
2.2:1Fail
3:1Fail
2
1.2:1Fail
1.3:1Fail
1.9:1Fail
2.5:1Fail
3
1.5:1Fail
1.3:1Fail
1.5:1Fail
2:1Fail
4
2.2:1Fail
1.9:1Fail
1.5:1Fail
1.3:1Fail
5
3:1Fail
2.5:1Fail
2:1Fail
1.3:1Fail

Similar palettes

More like Sakura Blossom Dawn

View all pastel