Why Framer Motion?
Unlike CSS transitions, Framer Motion runs a spring physics simulation. This means animations are naturally interruptible.
Example: The Spring Bounce
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
transition={{ type: 'spring', stiffness: 300, damping: 20 }}
/>
