StaggeredButton
A smooth stagger-hover button where each letter swaps in with a sliding animation. Fully responsive and customizable for text, timing, easing, and style.
Made with Workshop
Build your own component with AI
About this Component
This stagger-hover button adds a smooth, letter-by-letter slide animation that activates when the user hovers over the button. Each character animates with a slight delay, creating a clean, modern stagger effect. The button works with any text, adapts across breakpoints, and offers full styling control—perfect for adding subtle motion and premium interaction to any Framer project.
Features
Custom text
Responsive variants for breakpoints
Add a link
Adjustable font styles
Custom button color
Custom text color
Border size control
Border color control
Adjustable padding
Border radius customization
Animation duration control
Stagger delay for letter timing
Custom easing options
Animation direction: up or down
