Logo Animation Component
Published Sep 30, 2024
⋅
Updated Mar 13, 2025
⋅
0 minutes read
This component creates a playful, skeuomorphic animation inspired by the work of Preet Mishra. It simulates a pocket-like interface where images appear to be stacked and animated in a fluid, natural way.
How It Works
The animation uses Framer Motion to create a spring-based animation effect where three images (my logo work) animate into position with a slight delay between each. The component features:
- A custom clip path that creates the pocket-like shape
- Spring physics for natural-feeling motion
The component accepts an optional trigger
prop that can be used to programmatically restart the animation from a parent component.