How it behaves
Exactly what the prompt builds — every timing and easing is specified, so the result matches the demo.
- Spawn: a new 175 × 175px tile appears whenever the cursor has moved more than 150px since the last one. The tiles cycle through your photos in order.
- Glide: each tile starts at a smoothed (lagging) cursor position and slides to the real cursor over 1s cubic-bezier(0.25, 0.46, 0.45, 0.94), so fast movements leave a trail that catches up.
- Open: the tile is ten strips, each 10% tall. Each strip starts as a zero-width line at its centre and grows to full width (clip-path) over 0.75s cubic-bezier(0.87, 0, 0.13, 1). The two middle strips start first and the outer ones follow 100ms apart per step away from the middle.
- Close: after 1s each tile collapses back to centre lines over 1s, this time outer strips first, 25ms apart. The photo also dims to 25% as it goes, then the tile is removed.
- Hero (demo): a full-height near-black section with a background photo at 20% opacity and two small uppercase mono lines centered. The trail sits above everything and ignores clicks.
- Screens 1000px and narrower: the trail is switched off, as in the original, and the hero shows on its own.
- Fallbacks: reduced motion switches the trail off as well.