Rock’n’Rose
#fc8aaa
Dusty warm pink-red anchor for cozy contrast
About Rock’n’Rose
Rock'n'Rose looks like a rose-petal blush with a confident red under it, not the candy-syrup softness you get from Piggy or Strawberry Dreams. It sits a step deeper and more saturated than Magical Girl, so it reads less "pink-first" and more rose-red the moment it touches a UI surface. Compared with those lighter neighbors, it doesn't flatten into everyday tinting, and it avoids the hotter magenta push of the cooler picks.
I reach for this when I need primary accents that still feel human. It's great for healthcare dashboards and patient portals where selected states, chips, and key-callout backgrounds need to feel supportive but unmistakable, especially on light layouts. You'll also see it work well in beauty and retail interfaces for promo highlights that need clarity without drifting into warning territory.
One quirk: it holds up best against clean cool grays and crisp white. With warm creams, it can start to look a little more rosy than planned.
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.