Back to palettes

Palette

Rose Petal Dawn

The gentle, muted hues of rose petals kissed by the first light of a peaceful morning.

pastelcalm5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Rose Petal Dawn 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 Rose Petal Dawn.

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

Data visualization

#F3E0E2#ECCCDC#D8BFD8#C497B0#B07E8E

Palette guide

How to use Rose Petal Dawn

Overview

The "Rose Petal Dawn" palette features the gentle, muted hues of rose petals kissed by the first light of a peaceful morning. With colors ranging from the airy #F3E0E2 to the grounded #B07E8E, this palette is calm and delicate, perfect for creating a serene and natural aesthetic. Designers and developers can utilize its harmonious progression, including shades like #ECCCDC and #C497B0, to craft inviting digital experiences, soft branding, or elegant print materials that evoke tranquility and subtle beauty.

Best used for

  • Floral and garden-inspired branding
  • Wellness and yoga studio marketing
  • Gentle cosmetics and skincare packaging
  • Romantic stationery and greeting cards
  • Nature-inspired web design and blogs
  • Baby product branding and nursery decor

Suggested color roles

primary

Use #B07E8E as a strong, grounding color for main headings, navigation, or brand elements that need to convey stability and depth.

secondary

Apply #C497B0 for supportive text, subheadings, or larger content blocks that provide a richer, complementary tone.

accent

Utilize #D8BFD8 for gentle highlights, interactive elements, or graphical details that need a soft, delicate pop.

background

Employ #F3E0E2 as a light, airy background, providing a clean and serene canvas that enhances the palette's overall mood.

text

For body text, a dark plum or charcoal is recommended for optimal readability. For prominent headings, #B07E8E offers excellent contrast against lighter backgrounds.

Accessibility notes

  • The lightest colors, #F3E0E2 and #ECCCDC, require dark text (e.g., #B07E8E or black) for sufficient contrast and readability.
  • Avoid using #D8BFD8 or #ECCCDC for small text on very light backgrounds as contrast may not meet WCAG AA standards.
  • Ensure interactive elements have clear visual feedback on hover/focus states with adequate contrast.
  • Always test color combinations with a contrast checker to ensure accessibility for all users.

Recommended combinations

Dawn Mist

Ideal for subtle background gradients, overlays, or creating a gentle, atmospheric feel in digital interfaces.

#F3E0E2 · #ECCCDC · #D8BFD8

Petal Depth

Perfect for hero sections, brand logos, or key information where a strong, sophisticated anchor is desired.

#B07E8E · #C497B0 · #F3E0E2

Gentle Bloom

Use for buttons, secondary calls-to-action, or small design accents that need to subtly stand out with elegance.

#D8BFD8 · #ECCCDC · #B07E8E

CSS variables

:root {
  --rose-petal-dawn-1: #F3E0E2;
  --rose-petal-dawn-2: #ECCCDC;
  --rose-petal-dawn-3: #D8BFD8;
  --rose-petal-dawn-4: #C497B0;
  --rose-petal-dawn-5: #B07E8E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "rose-petal-dawn": {
        1: "#F3E0E2",
        2: "#ECCCDC",
        3: "#D8BFD8",
        4: "#C497B0",
        5: "#B07E8E",
      }
    }
  }
}

Related searches

rose petal color schemegentle pink palettesoft floral huescalm blush tonesdelicate dawn colors

Palette colors

Hex values

Color 1#F3E0E2
·
Color 2#ECCCDC
·
Color 3#D8BFD8
·
Color 4#C497B0
·
Color 5#B07E8E
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.3:1Fail
2:1Fail
2.7:1Fail
2
1.2:1Fail
1.2:1Fail
1.7:1Fail
2.3:1Fail
3
1.3:1Fail
1.2:1Fail
1.5:1Fail
2:1Fail
4
2:1Fail
1.7:1Fail
1.5:1Fail
1.4:1Fail
5
2.7:1Fail
2.3:1Fail
2:1Fail
1.4:1Fail

Similar palettes

More like Rose Petal Dawn

View all pastel
Morning Petal Blush
Whispering Orchid Petal
Cherry Bloom Serenity
Cherry Blossom Bloom
Cherry Blossom Blush
Cherry Blossom Cloud