Video and animated GIF

Record pages as MP4, WebM, animated GIF or animated WebP, including smooth scroll-through videos.

Record a page

Set format to mp4, webm or gif, and the page is recorded in real time instead of captured once. webp is a still image by default and is recorded as an animated WebP when you set any animation option (animation_duration, animation_fps or animation_scroll).

curl -X POST "https://shotkit.net/api/take" \
  -H "X-Access-Key: YOUR_ACCESS_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url":"https://example.com","format":"mp4","animation_duration":5}' \
  --fail-with-body -o shot.mp4

Option	Default	Range
`animation_duration`	`3` seconds	0.5–20
`animation_fps`	30 for video, 10 for GIF/WebP	1–30
`animation_scroll`	`false`	Scroll to the bottom while recording.
`image_quality`	`80`	Video bitrate for MP4/WebM.

Recording starts once the page is ready, after clicks, scripts and waits, so you can record exactly the state you set up.

Scroll-through videos

animation_scroll=true scrolls smoothly from the top to the bottom over the duration. It's the recorded counterpart of full page (full_page itself isn't supported for recorded formats):

curl -X POST "https://shotkit.net/api/take" \
  -H "X-Access-Key: YOUR_ACCESS_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url":"https://example.com","format":"mp4","animation_scroll":true,"animation_duration":10,"block_cookie_banners":true}' \
  --fail-with-body -o shot.mp4

Animated GIF and WebP

GIF and animated WebP play everywhere images do: READMEs, emails, chat. Keep them short and small; lower animation_fps and scale down with image_width. For WebP, setting animation_duration is what makes it animated:

curl -X POST "https://shotkit.net/api/take" \
  -H "X-Access-Key: YOUR_ACCESS_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url":"https://example.com","format":"gif","animation_duration":4,"animation_fps":12,"image_width":640}' \
  --fail-with-body -o shot.gif

An animated WebP is usually much smaller than a GIF at the same quality:

curl -X POST "https://shotkit.net/api/take" \
  -H "X-Access-Key: YOUR_ACCESS_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url":"https://example.com","format":"webp","animation_duration":4,"image_quality":70,"image_width":640}' \
  --fail-with-body -o shot.webp

Record one element

selector (or a clip) crops the recording to an element, for example an animated chart or a component demo:

curl -X POST "https://shotkit.net/api/take" \
  -H "X-Access-Key: YOUR_ACCESS_KEY" \
  -H "Content-Type: application/json" \
  -d '{"url":"https://example.com","format":"webm","selector":".hero","animation_duration":4}' \
  --fail-with-body -o shot.webm

The element must be inside the viewport while recording; it's scrolled into view first.

Things to know

Recordings are made at 1× resolution; device_scale_factor doesn't apply.
Recording takes real time, so a 20-second video takes at least 20 seconds. For long recordings, use async.