Slide Button
Transform CTAs with a sleek, animated slide button that adds motion, intent, and delight to every interaction — perfect for payments, confirmations, or critical actions.
Make it with Workshop
Build your own component with AI
Transform CTAs with a sleek, animated slide button that adds motion, intent, and delight to every interaction — perfect for payments, confirmations, or critical actions.
Make it with Workshop
Build your own component with AI
Featuring smooth motion, subtle shadows, and a glowing shimmer effect, the button instantly draws attention. Its clean design fits effortlessly into modern UI layouts, and it’s perfect for CTAs that demand user confirmation — like “Slide to Pay” or “Slide to Continue”.
• Interactive slider mechanism
• Smooth, responsive animations with tactile haptic feedback on touch devices
• Success & error states with redirect links
• Built-in shimmer and bounce effects for visual affordance
• Custom icons for idle/loading/success/error states
• Realistic motion feedback and depth effects
• Works beautifully across desktop and mobile
• Designed for intent-based CTAs (payments, confirmations, etc.)
• Transition effects
• Trigger threshold (how far the button must move to trigger the action)
• Resolve to success/error state
• Success/error redirect links
• Loading duration
• Haptic feedback (on/off + strength)
• Track padding, color, and shadow
• Button padding, color, and bounce animation (on/off)
• Accent color
• Label shimmer (on/off, duration, direction)
• Label font customization
• Idle label & color
• Loading/success/error labels & their colors
• Icon size & color
• Custom SVG upload for each state (idle/loading/success/error)
• Copy and paste the component into your Framer project.
• Customize the look and behaviour in the properties panel.
• Add success/error links (or leave blank for no redirects).
• That’s it! Your interactive Slide Button is ready to enhance your CTAs.
Note: Internal redirects (like /home, /about) work only inside a browser window. Previewing in the Framer Player may return a 404 error.
