Dreamy Flame

pastel palette with a balanced five-color hierarchy for design use.

#Pastel#Soft#Light

Open in Generator

COLOR 1

#DD9FBF

Nadeshiko Pink

COLOR 2

#E9C4D1

Pastel Pink

COLOR 3

#D59A9D

Rosy Brown

COLOR 4

#F0E7E4

Linen

COLOR 5

#F6F9F9

Slate 50

Color Values & Codes

HEX · RGB · HSL

Nadeshiko Pink

#DD9FBF

rgb(221, 159, 191)hsl(329, 48%, 75%)Color details →

Pastel Pink

#E9C4D1

rgb(233, 196, 209)hsl(339, 46%, 84%)Color details →

Rosy Brown

#D59A9D

rgb(213, 154, 157)hsl(357, 41%, 72%)Color details →

Linen

#F0E7E4

rgb(240, 231, 228)hsl(15, 29%, 92%)Color details →

Slate 50

#F6F9F9

rgb(246, 249, 249)hsl(180, 20%, 97%)Color details →

Open In Design Tools

Palette Generator

Lock & shuffle colors

Explore category schemes

CSS Variables

Copy & paste directly into your stylesheet

:root {
  --color-1: #DD9FBF;
  --color-2: #E9C4D1;
  --color-3: #D59A9D;
  --color-4: #F0E7E4;
  --color-5: #F6F9F9;
}

Role-Based WCAG Contrast Audit

Accessibility contrast depends on assigned UI roles. Here are the contrast ratios and WCAG compliance ratings when pairing palette colors as Foreground Text against Background surfaces:

Sample Text

#DD9FBF on #F0E7E41.76:1

Large Text Only (Fail)

Sample Text

#DD9FBF on #F6F9F92.03:1

Large Text Only (Fail)

Sample Text

#E9C4D1 on #F0E7E41.30:1

Large Text Only (Fail)

Sample Text

#E9C4D1 on #F6F9F91.49:1

Large Text Only (Fail)

Sample Text

#D59A9D on #F0E7E41.93:1

Large Text Only (Fail)

Sample Text

#D59A9D on #F6F9F92.22:1

Large Text Only (Fail)

Related Palettes in Pastel

cp-featured-20Pastel

PastelSoft

cp-featured-25Pastel

PastelFoodCreative

cp-featured-26Pastel

PastelFreshNature

cp-0051Pastel

PastelSoftLight