Back to palettes

Palette

Soft Petal Blush

A delicate progression of pinks, capturing the gentle blush of freshly bloomed rose petals.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FCE4EC#F8BBD0#F48FB1#EC407A#D81B60

Palette guide

How to use Soft Petal Blush

Overview

The Soft Petal Blush palette offers a delicate yet vibrant progression of pinks, capturing the gentle blush of freshly bloomed rose petals. Ranging from the airy #FCE4EC to the rich #D81B60, this palette is ideal for designs that seek romance, passion, and sophisticated femininity. Designers can leverage these hex codes for beauty brands, wedding themes, or any project requiring a captivating yet soft aesthetic. Developers will find these harmonious pinks excellent for creating inviting UI elements, expressive illustrations, or backgrounds that convey warmth and charm. Its gradient of pinks ensures versatility for various design applications, from subtle to bold.

Best used for

  • Beauty and cosmetic branding
  • Valentine's Day promotions
  • Fashion and apparel e-commerce
  • Romantic event invitations
  • Women's lifestyle blogs
  • Floral design and photography

Suggested color roles

primary

Use #FCE4EC as a light, airy primary background to set a delicate and inviting tone.

secondary

Apply #F8BBD0 for content blocks or secondary UI elements, offering a slightly richer pink base.

accent

Utilize #EC407A for interactive elements, calls-to-action, or important headings to provide clear emphasis and energy.

background

Employ #FCE4EC for main backgrounds to create an open, soft, and romantic ambiance.

text

#D81B60 offers a strong, readable option for body text against lighter palette colors, ensuring excellent contrast and impact.

Accessibility notes

  • Ensure sufficient contrast when pairing #F8BBD0 with #F48FB1 for text; test against WCAG standards.
  • #D81B60 provides excellent contrast on #FCE4EC for body text, ensuring readability for all font sizes.
  • Avoid using #FCE4EC or #F8BBD0 for small text on similarly light backgrounds to prevent readability issues.
  • For critical interactive elements, #EC407A or #D81B60 offers strong visibility and clear user feedback.

Recommended combinations

Rose Gradient

Ideal for creating smooth, captivating gradients in backgrounds or layered graphics, mimicking rose petal depth.

#FCE4EC · #F48FB1 · #EC407A

Bold Romance

Use for a striking look where a light background meets bold, impactful text and interactive elements.

#FCE4EC · #EC407A · #D81B60

Deep Blush

Excellent for sections requiring more visual weight, such as headers, footers, or highlighted content blocks with rich pinks.

#F8BBD0 · #F48FB1 · #D81B60

CSS variables

:root {
  --soft-petal-blush-4-1: #FCE4EC;
  --soft-petal-blush-4-2: #F8BBD0;
  --soft-petal-blush-4-3: #F48FB1;
  --soft-petal-blush-4-4: #EC407A;
  --soft-petal-blush-4-5: #D81B60;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "soft-petal-blush-4": {
        1: "#FCE4EC",
        2: "#F8BBD0",
        3: "#F48FB1",
        4: "#EC407A",
        5: "#D81B60",
      }
    }
  }
}

Related searches

rose pink color paletteromantic pink shadesvibrant blush colorsfeminine web designgradient pink aesthetic

Palette colors

Hex values

Color 1#FCE4EC
·
Color 2#F8BBD0
·
Color 3#F48FB1
·
Color 4#EC407A
·
Color 5#D81B60
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.3:1Fail
1.9:1Fail
3.1:1AA18
4.1:1AA18
2
1.3:1Fail
1.4:1Fail
2.3:1Fail
3.1:1AA18
3
1.9:1Fail
1.4:1Fail
1.7:1Fail
2.2:1Fail
4
3.1:1AA18
2.3:1Fail
1.7:1Fail
1.3:1Fail
5
4.1:1AA18
3.1:1AA18
2.2:1Fail
1.3:1Fail

Similar palettes

More like Soft Petal Blush

View all pastel
Soft Blossom Petals
Blushing Rose Dew
Cherry Blossom Breeze
Cherry Blossom Breeze
Cherry Blossom Dawn
Cherry Blossom Lane