Free pack · built with sdtk-design
A whole page, not just the first screen.
The hero pack gives you an opening shot. This gives you the page that follows it. Scroll World puts a pre-rendered camera flight under the reader’s thumb, then keeps going into the sections that actually sell something.
Scroll inside the frame to fly. Everything you see is in the download.
Measured, not asserted
The small clip is the fast one.
A scrub issues a seek on every frame, so decode cost dominates. We drove real scroll in a real browser and counted how many of the clip's frames actually reached the screen — the 1536×832 master loses two of every twenty-four; the 960×520 clip that ships here loses none, at a third of the bytes.
- 24 / 24
- clip frames delivered per second while scrubbing
- 33 ms
- longest stall at any scroll speed, reversal included
- 1.94 MB
- the clip a desktop visitor downloads
- 13 KB
- the entire engine — no library, no build step
The README ships the method and the harness. Do not take these numbers on our say-so — reproduce them.
What you get
One folder. Double-click and it runs.
Complete without the video
Delete every .mp4 and the page still reads. The poster stays, the copy still lands. Footage is an upgrade, never a dependency — which is why you can ship before you have any.
Runs from a file
No server, no build, no install. The engine takes a different code path on file:// specifically so double-clicking index.html works.
Themed by tokens
Every colour resolves from a CSS custom property. Edit :root once, or switch palette in the corner of the live preview.
Bring your own five seconds
Swap in your footage and extract a poster from its first frame. The README carries the exact ffmpeg settings that make a clip scrub instead of stutter.
More acts when you want them
The engine takes an array of scenes and cross-dissolves between them, so your clips do not need to be frame-continuous — most generation services cannot hold a seam anyway.
Degrades on purpose
With JavaScript off or under prefers-reduced-motion, the sticky stage releases and it becomes an ordinary stacked page. Nothing is hidden.
One honest caveat
On a portrait phone you see the middle quarter.
A landscape clip inside a tall viewport is cropped by object-fit: cover — roughly 75% of the width goes. This pack ships a smaller landscape clip for mobile rather than a portrait one, because a native 9:16 render was never proven on the pipeline that produced this footage. Frame your subject centrally, or supply your own portrait encode.
No render pipeline?
There is a version of this that needs no video at all.
three-flight is a live three.js camera flight along a spline. It costs nothing to regenerate, re-themes from your tokens at runtime, has no portrait-crop problem, and measures more motion than this pack does. What it does not buy you is photorealism.
sdtk-layout-scrollworld1.zip · MIT · no signup, no email