Back to palettes

Palette

Sugared Petals Bloom

A delicate and sweet palette inspired by dew-kissed petals dusted with morning light.

pastelplayful5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Sugared Petals Bloom 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 Sugared Petals Bloom.

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

Data visualization

#FDD7E4#FDCED0#E0BBE4#957DAD#D1CEEE

Palette guide

How to use Sugared Petals Bloom

Overview

The Sugared Petals Bloom palette is a delicate and sweet collection, inspired by dew-kissed petals dusted with morning light, perfect for designs that need a touch of gentle elegance. Featuring a range from the soft pinks like #FDD7E4 and #FDCED0 to the enchanting purples of #E0BBE4, #957DAD, and #D1CEEE, this palette creates a serene yet playful atmosphere. Designers can use these hues for sophisticated feminine brands, charming baby products, or romantic event themes, evoking a sense of tender beauty. For developers, these colors offer a harmonious foundation for light mode UIs, ensuring a soft and inviting user experience that feels both refined and approachable.

Best used for

  • Feminine branding and packaging
  • Baby and children's product design
  • Wedding and engagement stationery
  • Floral design and illustration
  • Soft lifestyle blog aesthetics
  • Spring-themed marketing campaigns

Suggested color roles

primary

#FDD7E4 provides a soft, inviting base, reflecting gentle warmth.

secondary

#E0BBE4 introduces a subtle, elegant lavender, adding depth and sophistication.

accent

#957DAD offers the deepest, most sophisticated hue for impactful highlights or calls-to-action.

background

#FDCED0 serves as a light, airy foundation, perfect for expansive areas.

text

#D1CEEE can be used for decorative headings, but a dark charcoal or black is recommended for body text on any background for optimal readability.

Accessibility notes

  • Many colors in this palette are very light; use a dark neutral text color (e.g., #333333) for body copy to ensure readability.
  • Avoid using light palette colors for small text, as their contrast against each other is generally insufficient.
  • Ensure interactive elements have clear visual states beyond color, such as underlines or distinct borders.
  • For users with visual impairments, provide alternative text for any color-dependent information.

Recommended combinations

Soft Bloom

Creates gentle, romantic backgrounds or subtle brand elements for feminine designs.

#FDD7E4 · #FDCED0 · #E0BBE4

Elegant Depth

Ideal for adding sophistication to headings, footers, or layered graphic designs.

#E0BBE4 · #957DAD · #D1CEEE

Playful Contrast

Useful for distinguishing key content or creating a gentle visual hierarchy in UI.

#FDD7E4 · #D1CEEE · #957DAD

CSS variables

:root {
  --sugared-petals-bloom-1: #FDD7E4;
  --sugared-petals-bloom-2: #FDCED0;
  --sugared-petals-bloom-3: #E0BBE4;
  --sugared-petals-bloom-4: #957DAD;
  --sugared-petals-bloom-5: #D1CEEE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "sugared-petals-bloom": {
        1: "#FDD7E4",
        2: "#FDCED0",
        3: "#E0BBE4",
        4: "#957DAD",
        5: "#D1CEEE",
      }
    }
  }
}

Related searches

floral pastel color schemesweet spring palettedelicate purple pinksoft feminine brandingdewy flower colors

Palette colors

Hex values

Color 1#FDD7E4
·
Color 2#FDCED0
·
Color 3#E0BBE4
·
Color 4#957DAD
·
Color 5#D1CEEE
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.3:1Fail
2.8:1Fail
1.2:1Fail
2
1.1:1Fail
1.2:1Fail
2.6:1Fail
1.1:1Fail
3
1.3:1Fail
1.2:1Fail
2.1:1Fail
1.1:1Fail
4
2.8:1Fail
2.6:1Fail
2.1:1Fail
2.4:1Fail
5
1.2:1Fail
1.1:1Fail
1.1:1Fail
2.4:1Fail

Similar palettes

More like Sugared Petals Bloom

View all pastel