Vanilla Cake
#fcf0ca
Warmer creamy off-white, more yellow than ice
About Vanilla Cake
On my screen, Vanilla Cake reads like a frosting edge that's been slightly smoothed out. It's not as yellow-forward as Hint of Yellow, and it doesn't feel as cool-clean as Vanilla Ice. Compared to Bullet Hell, it keeps the warmth, but it's toned down and more buttery than sunny, so it doesn't pull your eye toward the background.
I use it when I want the one you reach for in light-gray interfaces that still feel soft under product UI. It's a great base for dashboards and finance apps, especially behind tables, side panels, and empty-state cards where pure white would look flat. It also holds up well in publishing workflows, where body text and thumbnails need a gentle stage without the "almost-white" highlight behavior.
Pair it with slightly deeper grays and creamier whites. If you swap it into a very cool palette, it can start to look a touch more saturated than you expected, so match the overall temperature of the UI.
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.
