Back to palettes

Palette

Soft Petal Blush

A gentle harmony of soft pastels, mirroring the delicate beauty of springtime blossoms.

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

#F7DCDB#E1CFCF#C7D8C5#B1D8E7#DDEFF6

Palette guide

How to use Soft Petal Blush

Overview

The Soft Petal Blush palette offers a harmonious blend of gentle pastels, reflecting the delicate beauty of springtime blossoms. Featuring serene shades like the soft pink #F7DCDB, the refreshing green #C7D8C5, and the airy blue #B1D8E7, this palette is ideal for designs that evoke freshness, calm, and natural elegance. Designers can leverage these hex codes for spring-themed campaigns, organic branding, or any project requiring a light and uplifting atmosphere. Developers will find these harmonious colors excellent for creating soothing UI elements, gentle illustrations, or backgrounds that convey tranquility and openness. Its balanced mix of tones ensures versatility for various design applications.

Best used for

  • Spring-themed marketing campaigns
  • Organic food and beverage branding
  • Children's educational apps
  • Nature-inspired web design
  • Wellness and yoga studio branding
  • Eco-friendly product packaging

Suggested color roles

primary

Use #DDEFF6 as a clean, expansive primary background, offering a refreshing and open feel.

secondary

Apply #F7DCDB for content blocks or secondary UI elements, providing a soft, warm contrast.

accent

Utilize #C7D8C5 for interactive elements, highlights, or to introduce a natural, calming accent.

background

Employ #DDEFF6 or #B1D8E7 for main backgrounds to create an open, airy, and inviting ambiance.

text

None of the palette colors are suitable for body text; a dark charcoal or black is essential for accessibility and readability.

Accessibility notes

  • Due to the lightness of all colors, ensure all text and critical UI elements use colors outside this palette for adequate contrast.
  • Avoid using any palette colors for text on other palette colors; contrast will be insufficient for readability.
  • These colors are best suited for large background areas, decorative elements, or very large display text.
  • When using these shades, always test against WCAG guidelines for visual elements, especially for interactive components.

Recommended combinations

Spring Meadow

Ideal for evoking a fresh, natural landscape, perfect for backgrounds or segmented content areas.

#DDEFF6 · #C7D8C5 · #F7DCDB

Calm Flow

Use for a serene, flowing design, suitable for headers, footers, or to create a cohesive brand presence.

#B1D8E7 · #DDEFF6 · #E1CFCF

Gentle Contrast

Excellent for designs that require soft separation between elements without strong visual disruption.

#F7DCDB · #C7D8C5 · #E1CFCF

CSS variables

:root {
  --soft-petal-blush-3-1: #F7DCDB;
  --soft-petal-blush-3-2: #E1CFCF;
  --soft-petal-blush-3-3: #C7D8C5;
  --soft-petal-blush-3-4: #B1D8E7;
  --soft-petal-blush-3-5: #DDEFF6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "soft-petal-blush-3": {
        1: "#F7DCDB",
        2: "#E1CFCF",
        3: "#C7D8C5",
        4: "#B1D8E7",
        5: "#DDEFF6",
      }
    }
  }
}

Related searches

spring pastel palettedelicate floral colorscalm nature aestheticsoft blue green pinkairy web design colors

Palette colors

Hex values

Color 1#F7DCDB
·
Color 2#E1CFCF
·
Color 3#C7D8C5
·
Color 4#B1D8E7
·
Color 5#DDEFF6
·

Accessibility

Contrast checker

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

Similar palettes

More like Soft Petal Blush

View all pastel
Blushing Petal Softness
Gentle Blossom Whisper
Petal Soft Reverie
Cherry Bloom Serenity
Cherry Blossom Bloom
Cherry Blossom Blush