Porcelain Skin
#ffe7eb
Cool, very pale gray-pink for airy backgrounds
About Porcelain Skin
Porcelain Skin reads like skin-smooth light gray with a faint blush haze, but it never turns into the creamy pink body of Just Pink Enough or the edge-coated look of Sugar Coated. Compared with Pink Lemonade, it feels a touch denser and more settled, not as airy or uniformly washed.
I reach for it when the UI needs softness without drifting into rosy territory. It's great for health and wellness interfaces where you want cards, empty states, and section headers to feel human, not clinical, and it holds up in beauty product landing pages when you still need that gray-led structure. You can drop it under text-heavy modules and it stays calm, which makes it the one you reach for when you're building consistent layout rhythm across different page types.
Quirk: next to stronger mauves or hotter pinks, the blush undertone can look slightly "powdered," so I usually pair it with neutral charcoals or cooler grays to keep it 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.
