Fill Button
Animated Button Switch for Framer: morphs solid ↔ outline on hover/click, with icon, radius, stroke, and theme-aware styles.
Make it with Workshop
Build your own component with AI
About this Component
A Framer button component that transitions between solid and outlined styles using Variants. Configure label, left/right arrow icon, radius (pill–square), stroke width, padding, and text styles. Supports hover, pressed, and disabled states with editable duration/easing. Works with light/dark themes (auto or manual), inherits project fonts, and scales for mobile/desktop.
Exposes onClick and link target, plus slots for custom icons. Keyboard accessible (Tab/Enter/Space), focus ring included, and ARIA label ready. Built for performance (no heavy filters), override-friendly, and CMS/data-binding compatible.
