Skip to content

Liquid Fill Button

Give your buttons a liquid fill effect

Liquid Fill Button preview image 1

Summary

The Liquid Fill Button goes beyond simple hover effects.

Description

Bring your CTAs to life with smooth liquid motion.

The Liquid Fill Button goes beyond simple hover effects. With a buttery-smooth rising fill animation and four flow directions, your call-to-action feels alive.

Choose from three Quick Styles — Default, Glass Glow, or Soft Blur — or fine-tune every detail with Framer-native controls:

• ✨ Colors & Borders: Set your size, fill, border, hover and radius.

• 🅰️ Typography: Full Framer font picker, weight, size, alignment.

• ⏱ Motion: Dial in custom fill and drain durations for the perfect rhythm.

• 💫 Effects: Toggle Blur or Glow for subtle or standout looks.

All fully responsive, link-ready, and styled with premium defaults for that Framer-native feel.

Perfect for: landing pages, hero CTAs, product launches, or anywhere you want your button to flow instead of just click.

👉 Make your buttons liquid smooth

Rank history How rankings work →

1500110001107468/149/49/2610/1811/9
  • All · #10729

Details

More like this