A tactile button featuring physics-driven magnetic pull, independent text parallax, and an origin-based radial hover wipe. Designed to add composed, high-performance interaction to refined layouts.
Adjustable text and typography controls for seamless brand alignment.
Native hyperlink inputs with optional new-tab targeting for standard navigation routing.
Customizable background color, container padding, and corner radius for precise structural fit.
Configurable base and hover box-shadow support for establishing interactive depth.
Origin-based radial hover fill for a fluid, cursor-aware background transition.
Dynamic text color inversion during the hover wipe for sustained legibility across contrasting states.
Adjustable wipe transition easing and duration for precise animation pacing.
Configurable cursor pull strength and maximum travel range for strict interaction boundaries.
Adjustable spring stiffness and damping for exact calibration of kinetic snap and friction.
Expandable invisible activation area to capture the cursor before it reaches the component edge.
Independent inner text parallax with adjustable drift strength for layered spatial depth.
Singleton pointer tracking and frame batching for 60fps performance across dense component layouts.
Scroll-aware visibility tracking to suspend mathematical calculations when the component leaves the viewport.
Automatic touch-device detection to safely disable magnetic physics on mobile screens.
Semantic anchor wrapping and tabIndex fallbacks for complete keyboard accessibility.
Native text-highlight prevention for uninterrupted interactive behaviors.
Drag and drop the component onto your Framer canvas.
Configure the properties to match your design style.
Publish your project to view your component live.
Anchor your design system with physics-driven spatial depth.
A tactile button featuring physics-driven magnetic pull, independent text parallax, and an origin-based radial hover wipe. Designed to add composed, high-performance interaction to refined layouts.
Adjustable text and typography controls for seamless brand alignment.
Native hyperlink inputs with optional new-tab targeting for standard navigation routing.
Customizable background color, container padding, and corner radius for precise structural fit.
Configurable base and hover box-shadow support for establishing interactive depth.
Origin-based radial hover fill for a fluid, cursor-aware background transition.
Dynamic text color inversion during the hover wipe for sustained legibility across contrasting states.
Adjustable wipe transition easing and duration for precise animation pacing.
Configurable cursor pull strength and maximum travel range for strict interaction boundaries.
Adjustable spring stiffness and damping for exact calibration of kinetic snap and friction.
Expandable invisible activation area to capture the cursor before it reaches the component edge.
Independent inner text parallax with adjustable drift strength for layered spatial depth.
Singleton pointer tracking and frame batching for 60fps performance across dense component layouts.
Scroll-aware visibility tracking to suspend mathematical calculations when the component leaves the viewport.
Automatic touch-device detection to safely disable magnetic physics on mobile screens.
Semantic anchor wrapping and tabIndex fallbacks for complete keyboard accessibility.
Native text-highlight prevention for uninterrupted interactive behaviors.
Drag and drop the component onto your Framer canvas.
Configure the properties to match your design style.
Publish your project to view your component live.
Anchor your design system with physics-driven spatial depth.
Shouvik Biswas
