Violet Vogue
#e9e1e8
Softer violet-gray bias for fashion-forward UI panels
About Violet Vogue
I keep grabbing Violet Vogue when I want a gray background that still has a designer's pulse. It's not the soft, pink hush of Bubble Bath and it doesn't sit as consistently neutral as Chrome. This one reads as a pale violet-tinted gray with a slightly cooler lean, so the surface feels more "tuned" than plain.
For light-mode UI, it works great behind typography-heavy layouts where you want gentleness without drifting toward lilac or warmth. Think healthcare portals, editorial publishing systems, help centers, and e-learning dashboards that show lots of cards and empty states. It pairs especially well with mid-tone ink and darker neutrals, because the faint purple undertone makes controls look crisp without shouting. It's my go-to the one you reach for when gray needs more personality than Chrome, but less warmth than Bubble Bath.
Quirk: it can look slightly more purple next to very cool grays, so I usually balance it with warmer text or muted beige accents.
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.