Porcelain Drift
Soft diffused light through gauze, where cool blues meet warm cream in hushed, almost-there tones.
Psychology
The triadic balance between blue-dominant tones and warm apricot and lavender creates visual equilibrium without tension, while low saturation and high lightness across all five colors signal safety and restraint rather than demand. Cool blues recede while warm accents gently advance, producing a sense of spatial depth that feels contemplative rather than restless.
This combination triggers gentle nostalgia and trustworthiness, common responses to muted, light palettes often associated with skincare, wellness, and heritage brands.
This combination triggers gentle nostalgia and trustworthiness, common responses to muted, light palettes often associated with skincare, wellness, and heritage brands.
Usage
Apply to organic skincare packaging, luxury stationery design, and minimal wellness app interfaces where soft, approachable aesthetics build consumer confidence.
Low-contrast palettes like this excel in projects requiring legibility paired with calm, where visual noise would undermine the message. Fashion lookbooks, editorial photography, and interior design mood boards benefit from this palette's ability to showcase texture and material without aggressive color competition.
Low-contrast palettes like this excel in projects requiring legibility paired with calm, where visual noise would undermine the message. Fashion lookbooks, editorial photography, and interior design mood boards benefit from this palette's ability to showcase texture and material without aggressive color competition.
Code
CSS Gradient
/* CSS gradient approximation of mesh gradient */
/* Note: This is a linear approximation. For the full animated mesh effect, use the React/JS export. */
background: linear-gradient(
90deg,
#f0fdf4 0%,
#e0c3fc 25%,
#8ecae6 50%,
#bde0fe 75%,
#fff1e6 100%
);Tailwind v4
/* app.css — Tailwind v4 */
@theme {
--color-gradient-1: #f0fdf4;
--color-gradient-2: #e0c3fc;
--color-gradient-3: #8ecae6;
--color-gradient-4: #bde0fe;
--color-gradient-5: #fff1e6;
}
/* Usage: bg-gradient-1, text-gradient-2, etc. */CSS Variables
--color-1: #f0fdf4; --color-2: #e0c3fc; --color-3: #8ecae6; --color-4: #bde0fe; --color-5: #fff1e6;
Hex values
#f0fdf4, #e0c3fc, #8ecae6, #bde0fe, #fff1e6
Building something? Get this palette via the REST API.
History
Similar palettes
Lavender Milk Hour
Silk Hour Reverie
Porcelain Twilight
Frosted Lavender Drift
Periwinkle Linen Study
Jade Hour Glow
Sorbet Afternoon
Milk Glass Morning
Neon Bloom Dusk
