Components/Buttons

Sliding Button

A high-performance interactive button that slides an icon into view on hover with spring animations and depth shadows.

buttonslidingmotion

Preview

Installation

npx shadcn@latest add https://grootstudio.vercel.app/r/sliding-button.json

Usage

Props

PropTypeDefaultRequiredDescription
childrenReactNodeundefinedThe content to display inside the button.
variant'default' | 'outline''default'The visual style of the button.
iconPosition'left' | 'right''right'Which side the sliding icon should appear on.
classNamestringundefinedOptional class names for custom styling.

Dependencies

motion/react
lucide-react