Sugar Coated
#ffedf1
Rosy-pink light gray, softer than Powder Puff
About Sugar Coated
On my monitor, Sugar Coated reads like a pale gray with a sweet, bubblegum-pink haze at the edges. It's not the soft, uniformly misty feel of Powder Puff, and it doesn't sit cooler and steadier like Snowman. Compared to Just Pink Enough, the pink here feels more like a light coating than an undertone that shows up as you build contrast.
I use it when I need a background that stays gentle but doesn't disappear into plain white. It's great for health and wellness interfaces where you want calm hierarchy, and it works well across beauty product landing pages when you need a hint of warmth without turning the UI rosy-forward. It also plays nicely in lightly designed editorial modules where captions and cards should feel airy, not clinical.
Pair it with neutral and slightly deeper grays so the pink haze stays subtle. If you drop it next to stronger reds, it can start to read as faintly dusty instead of clean.
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.
