Dream Setting
#ff77bb
Lighter magenta-pink for dreamy, soft focus UI
About Dream Setting
Dream Setting looks like the color you get after the flash goes off on a pink dress, then you dial the intensity back. It's a light, airy rose rather than a bold blush or a confident red-pink. Compared to Bubblegum Beam, it has more saturation and reads warmer, so it doesn't feel quite as playful and cool. Next to Blush Hour, it's less "in-your-face" and more settled, with no pushy momentum.
I like it for button states, micro-highlights, and soft card headers in beauty apps where you want friendly without slipping into "kid product" territory. It also holds up in wellness and patient-facing UI, especially on empty states, toggles, and supportive callouts where Brink Pink would feel too weighty. Versus Brink Pink, this one stays lifted, so it doesn't compete for attention with data.
Quirk: at small sizes it can read slightly dusty if your surrounding neutrals are too gray. Pair it with warm creams or gentle warm whites, and keep the surrounding accents cooler if you want it to stay crisp.
Code snippets
Copy this color into your project.
Contrast checker
WCAG 2.1 contrast ratios. AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 / 4.5:1.
On White #ffffff
On Gray 100 #f5f5f5
On Gray 900 #18181b
On Black #000000
Variations
Shades
Darker variations, created by mixing toward black.
Tints
Lighter variations, created by mixing toward white.
Tones
Muted variations, created by reducing saturation.
Hues
Hue rotations around the color wheel.
Temperatures
Warm and cool shifts of this color.
Color harmonies
Suggested palettes
Palettes built around this color.
Community palettes
Published palettes that include this color.