Back to palettes

Palette

Whispering Soft Petals

A collection of airy, gentle hues, reminiscent of tender flower petals kissed by a soft breeze.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Whispering Soft Petals 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 Whispering Soft Petals.

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

Data visualization

#F8BBD0#DCE775#B2EBF2#FFF9C4#E1BEE7

Palette guide

How to use Whispering Soft Petals

Overview

The Whispering Soft Petals palette is an airy and gentle collection, perfect for designs requiring a delicate touch. Featuring tender hues like the soft pink of #F8BBD0, the refreshing light green of #DCE775, and the serene blue of #B2EBF2, this scheme evokes the quiet beauty of flower petals. It's an ideal choice for creating a light, inviting, and subtly cheerful atmosphere. Designers and developers will find its pastel nature suitable for interfaces that prioritize softness and a non-intrusive visual experience, blending effortlessly with minimalist aesthetics and feminine branding.

Best used for

  • Delicate wedding invitations and stationery
  • Baby product packaging and branding
  • Spa and wellness website designs
  • Feminine fashion and beauty branding
  • Lightweight mobile app interfaces
  • Spring-themed digital art and illustrations

Suggested color roles

primary

Use #F8BBD0 as a primary brand color for a soft, inviting presence on hero sections or key elements.

secondary

Employ #E1BEE7 for secondary accents or subtle backgrounds, providing gentle contrast and harmony.

accent

Introduce #DCE775 for a refreshing pop of color in calls-to-action or illustrative details, drawing attention without being overpowering.

background

Utilize #FFF9C4 as a soft, warm background, offering a gentle canvas that allows other colors to subtly emerge.

text

Pair with a deep charcoal like #333333 or a rich plum for optimal readability against these light pastels.

Accessibility notes

  • Ensure sufficient contrast when using lighter pastels like #FFF9C4 for text on backgrounds.
  • For critical information, use darker text colors (e.g., deep charcoal) against #F8BBD0 or #B2EBF2.
  • Avoid low-contrast color combinations for interactive elements to ensure usability.
  • Test color pairings with accessibility checkers to meet WCAG guidelines for text and UI components.

Recommended combinations

Floral Blush

Perfect for creating a romantic, soft, and warm aesthetic in branding or UI elements.

#F8BBD0 · #E1BEE7 · #FFF9C4

Spring Dew

Evokes a fresh, airy, and gentle natural feel, suitable for light-hearted designs.

#DCE775 · #B2EBF2 · #F8BBD0

Pastel Serenity

Creates a calm, tranquil, and very light visual experience for backgrounds or subtle graphics.

#B2EBF2 · #E1BEE7 · #FFF9C4

CSS variables

:root {
  --whispering-soft-petals-1: #F8BBD0;
  --whispering-soft-petals-2: #DCE775;
  --whispering-soft-petals-3: #B2EBF2;
  --whispering-soft-petals-4: #FFF9C4;
  --whispering-soft-petals-5: #E1BEE7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "whispering-soft-petals": {
        1: "#F8BBD0",
        2: "#DCE775",
        3: "#B2EBF2",
        4: "#FFF9C4",
        5: "#E1BEE7",
      }
    }
  }
}

Related searches

soft pastel palettedelicate color schemelight floral colorsserene design palettegentle ui colors

Palette colors

Hex values

Color 1#F8BBD0
·
Color 2#DCE775
·
Color 3#B2EBF2
·
Color 4#FFF9C4
·
Color 5#E1BEE7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.2:1Fail
1.5:1Fail
1:1Fail
2
1.2:1Fail
1:1Fail
1.2:1Fail
1.2:1Fail
3
1.2:1Fail
1:1Fail
1.2:1Fail
1.3:1Fail
4
1.5:1Fail
1.2:1Fail
1.2:1Fail
1.5:1Fail
5
1:1Fail
1.2:1Fail
1.3:1Fail
1.5:1Fail

Similar palettes

More like Whispering Soft Petals

View all pastel