name: animations-motion description: Add smooth animations to buttons, page transitions, tasks, modals, and interactive elements.
Animations & Motion
Instructions
-
Buttons
- Hover scale/glow
- Click ripple effect
-
Page transitions
- Fade and slide effects
- Shared layout transitions for smooth navigation
-
Tasks & Modals
- Animate add, delete, complete
- Input focus and validation animations
Best Practices
- Keep animations subtle and purposeful
- Optimize performance for all devices
- Use Framer Motion or GSAP where appropriate