Circular Orbit

About this component Circular Orbit lets you create dynamic, interactive layouts with a smooth, rotating motion.

About this component Circular Orbit lets you create dynamic, interactive layouts with a smooth, rotating motion. Items move naturally along a circular path, giving depth and dimension to your designs. It works with any Framer component, so you can animate content directly—no image uploads required. Perfect for hero sections, galleries, or experimental layouts, it offers full control over motion, scale, blur, and perspective, while staying fully responsive and easy to use without code. Customizable Properties Items Items – Connect any Framer components as orbiting elements Size & Scale Start Size – Initial orbit radius End Size – Final size near the center Item Scale – Scale of individual items Motion Inward Speed – Speed at which items move toward the center Inward Easing – Easing behavior for inward motion (e.g. Spring) Rotation – Total rotation angle of the orbit Loop Speed – Rotation speed per second Loop Easing – Timing smoothness of the looping animation Depth & Blur Start Blur – Blur amount when items enter the orbit End Blur – Blur amount near the center 3D & Perspective Perspective – Depth perspective intensity 3D Rotation – Adjust rotation on X, Y, and Z axes Interaction Drag to Rotate – Enable or disable manual rotation via drag Use cases Hero sections · Interactive galleries · Editorial layouts · Experimental UI · Visual storytelling

An interactive, fully customizable orbit