Liquid AnimateButton

A sleek, animated liquid gradient.

Live Demo Give your Call-to-Action a premium, high-end feel. The Liquid Border Button is a professional-grade Framer component designed to help your most important buttons pop. Featuring a smooth, infinite rotating gradient effect, this button creates a sophisticated "glass-like" liquid border that immediately draws the eye and encourages interaction. Unlike standard static buttons, this component provides a dynamic visual experience that feels premium and polished—perfect for hero sections, landing pages, or anywhere you need to increase conversion rates. Built for Framer Designers: We know you need components that fit into your workflow, not ones that break it. That’s why we’ve built this with native Framer controls: Native Link Support: Easily connect your button to any page, URL, or overlay using Framer’s built-in link system. Complete Customization: Tweak every aspect of the button—from the liquid accent colors to the border width and corner radius—directly from the right-hand properties panel. Native Font Picker: Manage your typography using Framer’s native font controls, ensuring your button style stays perfectly synced with your site's global styles. Precision Padding: We’ve replaced rigid settings with individual padding controls (Top, Bottom, Left, Right), giving you absolute control over your button's footprint. High Performance: Built with Framer Motion and GPU-accelerated transforms, the liquid animation is buttery smooth and light on your site’s performance. What’s included: Liquid Border Button Component. Fully editable property controls. Responsive design documentation. Stop settling for static designs. Elevate your project with an interactive element that feels custom-coded, but works right out of the box.

A sleek, animated liquid gradient.