Heart Potion

#a97fb1

Save

About Heart Potion

I keep Heart Potion in my back pocket for the moments when a "regular" pink feels a little too sugary. It's lighter than Berries Galore, but unlike the more muted, purple-leaning Amorous it stays visibly pink at a glance. Compared with Dripping Wisteria, it's less damp and plush and more like a clean, hydrated blush with a soft magenta heart. The result is a gentle lift without going candy-bright.

In UI work, I use it for heartfelt states like completed steps, saved confirmations, and onboarding highlights where you want warmth but not the "poster pink" energy. It also shows up in health and wellness apps, creator analytics, and lifestyle media when section headers need attention that feels supportive, not salesy. Pair it with near-whites and cool greys, and you'll get separation fast. I'd still treat it like a medium-intensity accent: too much of it together can start to feel syrupy.

If you need a quick rule, go for it when the design needs approachability with restraint.

Gradient preview

See how this color looks in an animated mesh gradient.

Conversions

Click any value to copy.

Need this programmatically? Color API

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

Create a gradient with Heart Potion

Open the generator with this color pre-loaded.

Start creating