Palette

Dusty Rose Romance

A gentle and romantic blend of dusty rose pinks, evoking the timeless beauty of old-fashioned floral elegance.

pastelelegant5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Dusty Rose Romance 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 Dusty Rose Romance.

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

Data visualization

#8A5761#AE7C89#D3A1B1#ECCFD6#F9E5EA

Palette guide

How to use Dusty Rose Romance

Overview

The Dusty Rose Romance palette presents a gentle and romantic blend of dusty rose pinks, evoking the timeless beauty of old-fashioned floral elegance. Featuring delicate shades like #F9E5EA and #ECCFD6, which provide an airy, soft foundation, it deepens beautifully through #D3A1B1 and #AE7C89, culminating in the rich #8A5761. This palette is ideal for designers and developers seeking to create sophisticated, warm, and inviting experiences. Its subtle nature makes it perfect for conveying romance, femininity, and a touch of vintage charm across web interfaces, print media, and product designs.

Best used for

Elegant wedding stationery
Luxury beauty brand identity
Romantic fashion editorials
Feminine lifestyle blogs
Cozy interior design accents
Delicate packaging design

Suggested color roles

primary

#AE7C89 - A balanced, inviting dusty rose, ideal for main interactive elements or brand accents.

secondary

#D3A1B1 - A lighter, softer pink, excellent for supporting content or subtle highlights.

accent

#8A5761 - The deepest, most grounding rose-brown, perfect for impactful calls-to-action or strong emphasis.

background

#F9E5EA - The lightest, almost ethereal shade, providing a soft and airy canvas.

text

#8A5761 - A deep, rich rose-brown, ensuring strong readability against lighter palette colors.

Accessibility notes

Ensure #8A5761 is used for text on #F9E5EA or #ECCFD6 to meet WCAG contrast guidelines.
Lighter shades like #F9E5EA will require darker text for readability; avoid using other light palette colors for text.
Test contrast ratios for all text and background pairings, especially for interactive elements.
Consider supplementing with a pure black or dark charcoal for critical body text if #8A5761 proves insufficient on mid-tones.

Recommended combinations

Soft Petal Gradient

Smooth, subtle background transitions or layered visual effects in web or print.

#F9E5EA · #ECCFD6 · #D3A1B1

Deep Romance

High-contrast headings, buttons, or key information against a soft, light backdrop.

#8A5761 · #F9E5EA · #AE7C89

Elegant Harmony

Creating balanced content blocks or decorative elements with gentle depth and sophistication.

#AE7C89 · #D3A1B1 · #ECCFD6

CSS variables

:root {
  --dusty-rose-romance-1: #8A5761;
  --dusty-rose-romance-2: #AE7C89;
  --dusty-rose-romance-3: #D3A1B1;
  --dusty-rose-romance-4: #ECCFD6;
  --dusty-rose-romance-5: #F9E5EA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "dusty-rose-romance": {
        1: "#8A5761",
        2: "#AE7C89",
        3: "#D3A1B1",
        4: "#ECCFD6",
        5: "#F9E5EA",
      }
    }
  }
}

Hex values

Color 1#8A5761

Color 2#AE7C89

Color 3#D3A1B1

Color 4#ECCFD6

Color 5#F9E5EA

Accessibility

Contrast checker

1.7:1Fail

2.6:1Fail

4:1AA18

4.8:1AA

1.7:1Fail

1.6:1Fail

2.4:1Fail

2.9:1Fail

2.6:1Fail

1.6:1Fail

1.5:1Fail

1.8:1Fail

4:1AA18

2.4:1Fail

1.5:1Fail

1.2:1Fail

4.8:1AA

2.9:1Fail

1.8:1Fail

1.2:1Fail

Similar palettes

More like Dusty Rose Romance