Free for Mac · by 14islands
ScrollCapture makes smooth scroll-through videos of websites. It steps the page one frame at a time, so WebGL, video and smooth scrolling come out flawless at 30, 60 or 120 fps, however heavy the page.
Who it’s for
- 01
Creative agencies
Case-study films of the sites you launch. Timelines save, so a take can be redone when the client changes the copy.
- 02
WebGL developers
Shaders, particles and 3D scenes at a steady 60 or 120 fps, however hard the scene works the GPU.
- 03
Portfolio showreels
Every project scrolled the same smooth way, in ProRes 422 HQ, ready to cut together.
Frame stepping
A screen recorder films whatever the browser manages to paint in time. Heavy pages skip frames, and the video skips with them. ScrollCapture takes over the page’s clock instead: it moves time forward by exactly one frame, waits until the page has painted it, captures it, and only then moves on. Scrolling, video, WebGL and CSS animation all land on the frame they belong to.
One second of an eased scroll, slowed down 4×
Screen recording
Films the screen in real time
45 of 60 frames15 dropped
ScrollCapture
Steps the page’s clock, frame by frame
60 of 60 frames0 dropped
- 01Advance the clock+16.7 ms
- 02Wait for the paintas long as it takes
- 03Capture the frameframe 0001
- 04Encode, then againProRes 422 HQ
The timeline
A recording is a list of steps. Drag them into order, open one to fine-tune it, and press Preview to watch it play at the export’s frame rate. Steps don’t depend on each other: a scroll works out where it starts when it runs.
- Go to stepPlay stepEndEnd of pageDuration5sEasing
Scroll detection
What the app finds
It probes the page out of sight while it loads, then scrolls it the way it wants to be scrolled: natively where it can, by replaying wheel input where it must, steering until each step lands where you set it.
The window
Plain pages, and smooth scrolling on top of them: Lenis, GSAP ScrollSmoother, Locomotive.
Native
A scroll container
Page-like layouts where an inner element scrolls and the body stays put.
Native
Moved by transforms
Virtual scroll that translates a track on wheel input, with no scrollbar at all.
Wheel, steered
A WebGL canvas
Scenes with no DOM scroll to read. The wheel input is replayed, exactly as far.
Wheel, replayed
Sideways
Horizontal tracks and pinned galleries that slide as you scroll down.
Native or wheel
The details
Even the mouse.
Pointer path steps record a gesture once and replay it smoothly in every take. Click steps click right where you captured.
Desktop, tablet, phone.
Pick a preset or type any size. Every pixel is recorded at your display’s scale, so a Retina Mac gives you 2×.
Preview matches Record
Preview plays the page at the export’s frame rate, so what you tune is what you get.
Go to step, Play step
Put the page where any step starts, or play just that one, without running the whole take.
Overlapping steps
A Wait below zero starts the next step early, so a pointer move can ride along a scroll.
ProRes 422 HQ
Takes come out as .mov files in ProRes 422 HQ, ready for the edit.
Projects you can reopen
Timelines save as .scrollcapture files, so a take can be redone when the site changes.
Nothing else in the shot
Frames come from the page’s own rendering at Retina size, not the screen, so the cursor, notifications and other windows never end up in the video.
Open the DMG and drag ScrollCapture to Applications. The first time you record, macOS asks for Screen Recording permission.
Download for Mac