Skip to content
Swift

Scroll Effect Templates · v1.0.0

Formation

Image grids that assemble into twenty different arrangements.

Rated 4.8 out of 5 based on 47 reviews.720 sold20 variationsUpdated September 20, 2026
01 / 04Click to enlarge
Screenshots of the Formation template: Image grids that assemble into twenty different arrangements.
GridScrollPortfolioArchitecture

Overview

Formation is twenty scroll sections, each assembling its images into a different geometric arrangement - columns collapsing into rows, scattered tiles snapping to a grid, formations opening from the centre.

With around two hundred image slots it is the densest template here, and it is designed for archives. The pacing is the product: each formation holds just long enough to register before the next one starts building.

Best for: Photographers and architecture studios with a deep archive to move through.

What makes it different

1

Twenty distinct formations

No two sections resolve the same way, so a long scroll keeps earning attention.

2

Built for volume

Around 200 image slots, with sizes and crops handled by CSS so swapping assets does not break layouts.

3

Bricolage Grotesque

Self-hosted, and the exact face the original design used - restored rather than substituted.

4

Scrub-linked assembly

Formations build with scroll position, so scrubbing backwards disassembles them cleanly.

In the box

  • 1 page with 20 formation sections
  • GSAP 3.15 + ScrollTrigger + Lenis, vendored
  • Self-hosted Archivo and Bricolage Grotesque
  • 42 sample images

Built with

  • GSAP 3.15
  • ScrollTrigger
  • Lenis

Questions about Formation

Do I need 200 images?

No. Sections are independent - delete the ones you do not need and the rest still work.

How heavy is it?

Images dominate. Ship them as WebP at the sizes the CSS asks for and a full page lands around 2MB.

Still unsure? Email us - or read how to choose a template.

Related

You might also consider

Weft template - Ten variations on columns and rows gliding into place.40% off

Weft

$40$24

Ten variations on columns and rows gliding into place.

ScrollRated 4.7 out of 5 from 71 reviews.
Cascade template - Grid items rise and rotate into place, staggered column by column.65% off

Cascade

$40$14

Grid items rise and rotate into place, staggered column by column.

ScrollRated 4.7 out of 5 from 92 reviews.
Monolith template - One element carries an entire scrolling story.61% off

Monolith

$38$15

One element carries an entire scrolling story.

ScrollRated 4.9 out of 5 from 58 reviews.