Back to palettes

Palette

Sakura Petal Blush

A soft, delicate gradient of pinks, capturing the fleeting beauty of cherry blossoms in full bloom.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FADADD#FBCDD6#FBBBCF#FAA9C5#FA97BA

Palette guide

How to use Sakura Petal Blush

Overview

The Sakura Petal Blush palette (ID: sakura-petal-blush) is a beautifully subtle gradient of soft pinks, capturing the fleeting, delicate beauty of cherry blossoms in full bloom. It flows from the almost-white #FADADD through #FBCDD6, #FBBBCF, #FAA9C5, to the slightly deeper #FA97BA. This monochrome-like collection is designed for projects that require a consistently soft, gentle, and ethereal aesthetic. The subtle variations in tone allow for depth and visual interest without harsh contrasts, making it genuinely useful for creating a harmonious and serene atmosphere. It's perfect for conveying tenderness and sophistication.

Best used for

  • Delicate feminine branding
  • Baby and bridal shower themes
  • Soft background textures and patterns
  • Minimalist web design and UI accents
  • Romantic stationery and invitations
  • Subtle digital art and photography filters

Suggested color roles

primary

#FBBBCF (Blush Pink) serves as an inviting primary color, offering a gentle yet clear presence.

secondary

#FAA9C5 (Petal Pink) provides a slightly deeper, harmonious complement, ideal for secondary headings or featured content.

accent

#FA97BA (Rose Bloom) acts as a subtle accent, adding a touch of definition to interactive elements or key visuals.

background

#FADADD (Whisper Pink) offers an incredibly soft, almost-white base, creating an airy and clean canvas.

text

For body text, a medium-dark gray (e.g., #555555) ensures readability against the lighter shades. For headings or important calls to action, #FA97BA provides a gentle yet clear contrast, especially on #FADADD.

Accessibility notes

  • Due to the subtle differences, ensure sufficient contrast for text, especially when using lighter shades like #FADADD or #FBCDD6 as backgrounds.
  • The deepest shade, #FA97BA, should be used for critical text on the lightest backgrounds to meet WCAG AA standards.
  • Avoid low-contrast pairings for interactive elements; ensure clickable areas have clear visual distinction.
  • Consider larger font sizes for text used with the lighter pinks to aid readability for all users.

Recommended combinations

Soft Gradient

Creates smooth, ethereal backgrounds, subtle borders, or layered effects in digital designs.

#FADADD · #FBCDD6 · #FBBBCF

Petal Depth

Ideal for showing progression, creating subtle gradients, or adding visual weight to illustrations and icons.

#FBBBCF · #FAA9C5 · #FA97BA

Gentle Highlight

Use for a clean layout where the deepest pink provides definition against the light background, for headings or buttons.

#FADADD · #FA97BA · #FAA9C5

CSS variables

:root {
  --sakura-petal-blush-1: #FADADD;
  --sakura-petal-blush-2: #FBCDD6;
  --sakura-petal-blush-3: #FBBBCF;
  --sakura-petal-blush-4: #FAA9C5;
  --sakura-petal-blush-5: #FA97BA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sakura-petal-blush": {
        1: "#FADADD",
        2: "#FBCDD6",
        3: "#FBBBCF",
        4: "#FAA9C5",
        5: "#FA97BA",
      }
    }
  }
}

Related searches

monochromatic pink palettedelicate cherry blossom colorssoft blush color schemefeminine pastel design ideaslight pink gradient web colors

Palette colors

Hex values

Color 1#FADADD
·
Color 2#FBCDD6
·
Color 3#FBBBCF
·
Color 4#FAA9C5
·
Color 5#FA97BA
·

Accessibility

Contrast checker

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

Similar palettes

More like Sakura Petal Blush

View all pastel
Cherry Bloom Serenity
Cherry Blossom Bloom
Cherry Blossom Grace
Sakura Bloom Spring
Spring Blossom Blush
Blushing Petal Softness