Back to palettes

Palette

Soft Petal Whisper

Gentle and airy shades of pink and lavender, like soft petals brushing against a spring breeze.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#FADADD#FFC0CB#FFB6C1#E0BBE4#DAF0EE

Palette guide

How to use Soft Petal Whisper

Overview

The Soft Petal Whisper palette is a harmonious blend of delicate pinks, serene lavender, and a refreshing hint of minty green. Shades like `#FFB6C1` and `#FADADD` provide a gentle warmth, while `#E0BBE4` introduces a calming cool tone. The unexpected `#DAF0EE` adds a breath of fresh air, creating a truly unique and airy aesthetic. This palette is ideal for designers and developers seeking to evoke a sense of spring, freshness, and lighthearted charm in their projects, from sophisticated web designs to charming print materials.

Best used for

  • Spring fashion collections
  • Baby and children's apparel
  • Gentle, whimsical branding
  • Serene lifestyle websites
  • Garden-themed event invitations
  • Children's book illustrations

Suggested color roles

primary

Utilize `#FFB6C1` as the vibrant yet soft pink focal point for key elements and calls to action.

secondary

Employ `#E0BBE4` for supporting sections, subheadings, or backgrounds needing a calming, cool presence.

accent

Apply `#DAF0EE` sparingly as a refreshing, cool accent to add an unexpected pop and balance the warmer tones.

background

Use `#FADADD` as a light, inviting base for pages, providing a gentle and warm canvas.

text

Pair with a dark gray or charcoal text for optimal contrast and readability on all backgrounds.

Accessibility notes

  • All colors in this palette are very light; ensure text is dark (e.g., black or dark gray) for sufficient contrast.
  • Avoid using any of the palette colors for small text to prevent legibility issues.
  • The `#DAF0EE` (mint) provides a unique accent but should be used carefully with text to maintain contrast.
  • For UI elements, ensure clear visual cues for interactivity, as some color differences are subtle.

Recommended combinations

Spring Breeze

A fresh and balanced combination, perfect for creating a vibrant yet soft spring aesthetic.

#FFB6C1 · #E0BBE4 · #DAF0EE

Petal Softness

Creates a gentle, feminine gradient ideal for backgrounds, headers, or delicate design elements.

#FADADD · #FFC0CB · #E0BBE4

Airy Contrast

Combines the cool mint with warm pinks for a refreshing and inviting visual dynamic.

#DAF0EE · #FADADD · #FFB6C1

CSS variables

:root {
  --soft-petal-whisper-1: #FADADD;
  --soft-petal-whisper-2: #FFC0CB;
  --soft-petal-whisper-3: #FFB6C1;
  --soft-petal-whisper-4: #E0BBE4;
  --soft-petal-whisper-5: #DAF0EE;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "soft-petal-whisper": {
        1: "#FADADD",
        2: "#FFC0CB",
        3: "#FFB6C1",
        4: "#E0BBE4",
        5: "#DAF0EE",
      }
    }
  }
}

Related searches

spring pastel palettepink lavender mintdelicate floral colorsairy baby colorsserene spring design

Palette colors

Hex values

Color 1#FADADD
·
Color 2#FFC0CB
·
Color 3#FFB6C1
·
Color 4#E0BBE4
·
Color 5#DAF0EE
·

Accessibility

Contrast checker

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

Similar palettes

More like Soft Petal Whisper

View all pastel
Cherry Bloom Serenity
Cherry Blossom Bloom
Cherry Blossom Breeze
Cherry Blossom Cloud
Cherry Blossom Grace
Cherry Blossom Whispers