Motion Gallery · 3D & Perspective
Spiral Stream
Cards threaded along a 3D helix, rotating to show fronts, edges and mirrored backs.
Example 1 · Scroll choreography
Scroll to play — reveal & dissolve
A full scroll choreography. Motion → Scroll-scrub with Pin on, so YOUR scroll drives the motion — not a timer. Paired with Entrance (Style tab): as the gallery pins to the screen the cards fade in one by one, it animates as you scroll, then they dissolve one by one on the way out.
Example 2 · Entrance + pause on hover
Streaming vortex, pause on hover
The default — cards threaded on a tapering helix that narrows into a vortex, streaming forward. The whole stream zooms in on load; Motion → On Hover is Pause. Click a card to open the lightbox.
Example 3 · Long coil
A long coiling stream
More Spiral Turns (3) and far more cards (Card Count 24) make a long, dense coil winding back into depth.
Example 4 · Flared cylinder
Flared out, standing up
A positive Taper flares the coil outward instead of funnelling it, a wider Spiral Size, and Ring Tilt 0 stands it upright — an open, barrel-like stream.
Example 5 · Depth & pulse
Deep, breathing vortex
A strong Perspective exaggerates near/far, Scale Pulse breathes the card sizes along the coil, and the tail fades back — a living, organic vortex.
Example 6 · Ratio & size
Square cards, bigger
Bigger square 1:1 cards (the default is portrait 3:4) with rounded corners riding the spiral. Click a card to open it full-size. Plus Stage Overflow = Spill, so the fanned cards show in full beyond the stage box — and the gallery sits at Z-Index −1 (Advanced → Position: Relative) behind this heading, so the title stays clean in front of the overflow.
Docs & Playground
Tweak every option live
Play with all of these settings in real time and read the full option reference in the manual.
Free & open source
Build with this element, free.
Install the framework and the Bootstrap 5 theme, then drag this element into any page.