Images emerge from the center, fan outward, and spread into a circular orbit with a smooth GSAP timeline.
Image Orbit Burst is a timeline-driven animation that reveals a group of images from a central point and progressively distributes them into a circular layout. Each element first fades and scales into view, then rotates into a fan arrangement before transitioning into a radial orbit using trigonometric positioning. The animation uses GSAP timelines and dynamic calculations (cos/sin) to distribute items evenly along a circular radius, producing a smooth and visually balanced motion sequence.
npm i gsap
Ideal for hero sections, gallery intros, portfolio showcases, or visual storytelling where images dynamically expand from a central focal point.
Easy-Intermediate
| Prop | Type | Description |
|---|---|---|
| ease | string | GSAP easing function controlling how smoothly images rotate and settle into place. |
These components are designed for developers who have at least an intermediate understanding of React and GSAP. To fully customize, extend, or modify the behavior, familiarity with both libraries is recommended. They are not specifically intended for absolute beginners.
However, beginners can still use them by simply copying and pasting the code, it is already optimized and production-ready out of the box.
© 2026 dropui.design