Violet Pink
#fb5ffc
Light violet-magentas for airy accents over hot fuchsia
About Violet Pink
I keep seeing Violet Pink on product screens where the highlight looks like it got a soft violet filter, not a hot magenta coat. It reads lighter and more restrained than Pink Party, and it feels less weighty than Pink Flamingo. Compared to Vaporwave, it's warmer and more deliberate, so it doesn't come across as diffused or slightly see-through.
For UI, this is the highlight that stays readable when your background needs to stay calm. I use it for beauty commerce and fashion ecommerce chips, hover/active states, and tiny CTA accents in streaming and music apps where you want "pink energy" without turning the whole layout into a neon sign. It also works well on onboarding step markers and promo badges over light photography, especially when you want a playful tone with a hint of purple.
If you pair it with other pinks, keep one role clear. Next to Pink Flamingo it'll look more violet-leaning; next to Vaporwave it'll look warmer, so don't stack both at full strength unless you're okay with the color getting busier than you intended.
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.
