#f7ede2

Nearest named color: Magnolia Petal

Soft milky gray with rosy warmth for off-white balance

Save
Share

About Magnolia Petal

On my last mockup, read like paper that's been gently warmed in daylight, not milk and not rose. It's very light, but it doesn't flatten into pure white. Compared to , it feels more tinted and less neutral, with a calmer blush that stays under the surface. Versus , the creaminess is softer and less deliberate. And against , it stays noticeably less pink, more petal-like than rosy.

I use it when I want warmer, quieter backgrounds for products that need breathing room: editorial sites, consumer apps, and SaaS screens where tables, cards, and empty states can't compete with the content. It also behaves well behind photography, especially skin tones, because the undertone stays gentle instead of turning beige. This is the one you reach for when you want the gray-family feel without the background turning into either cream or blush.

Pair it with mid-tone grays and near-black type for best balance. If you jump to cool gray palettes, it can start to look a touch peachy fast.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

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

Aa
1.16:1Fail

On Gray 100 #f5f5f5

Aa
1.06:1Fail

On Gray 900 #18181b

Aa
15.33:1AAA

On Black #000000

Aa
18.17:1AAA

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

Complementary
Analogous
Triadic
Split Complementary
Tetradic

Suggested palettes

Palettes built around this color.

4 colors
3 colors
4 colors
4 colors

Community palettes

Published palettes that include this color.

Similar colors

#f9ede2
#f6eee2
#f6efe1
#f4eee0

Create a gradient with Magnolia Petal

Open the generator with this color pre-loaded.

Start creating