animation-motion - Create Smooth Animations with Framer Motion
Create smooth animations and micro-interactions using Framer Motion and CSS for UIs
Tags
Updated: 2026-05-11Capabilities
Typical Inputs
Typical Outputs
What this skill does
- create enter/exit animations
- add gesture interactions
- implement scroll animations
- create loading states
- optimize animation performance
- apply transition effects
- implement parallax effects
- handle reduced motion
- create skeleton loaders
- animate list items
- add hover effects
- handle drag gestures
Inputs
- React components
- UI elements
- Tailwind configuration
- animation duration values
- motion properties
Outputs
- animated components
- transition effects
- loading skeletons
- gesture-enabled elements
- scroll-triggered animations
Requirements
- React environment
- Framer Motion library
- CSS framework
- JavaScript runtime