About Origin Button Pro
Origin Button Pro is a premium animated button component for Framer that transforms ordinary call-to-action buttons into engaging micro-interactions.
Built with accessibility, responsiveness, and performance in mind, it supports keyboard navigation, touch devices, disabled states, smooth press animations, and optional cursor tracking for even more immersive interactions.
Inspired by Edwin Vakayil's work.
✨ What Makes It Stand Out
Cursor-origin hover animations
Three fill animation modes:
Radial Fill
Linear Wipe
Centered Fill
Optional cursor-following animation
Several animation styles to choose from
Separate styling for Default and Disabled states
Custom hover text color
Built-in URL linking
Optional "Open in New Tab"
Responsive across desktop, tablet, and mobile
Keyboard accessible with focus interactions
Smooth press animation for tactile feedback
🖌️ Customisations
Button Content
Button Label
Button Link
Open Link in New Tab
Default/Disabled State
Background Color
Text Color
Border Color
Border Width
Fill Animation
Fill Mode
Radial
Linear Wipe
Centered
Fill Color
Hover Text Color
Animation Style
Cursor Following Toggle
🚀 Usage
Add Origin Button Pro to your Framer canvas.
Enter your button label and optionally provide a destination URL.
Choose one of the three fill animation modes.
Select your preferred animation style.
Customize the colors for the button, fill effect, hover text, and border.
Adjust other properties to achieve the desired look and feel.
Publish your project and enjoy the beautifully animated CTA button.
After completing your purchase, you will receive a link to the component.
Copy the URL and paste it into your Framer project to import it.
