# How to turn a website into a scrolling GIF

> Make an animated GIF of a web page scrolling, from a URL, and keep the file small enough for email, docs and READMEs. When to use a GIF, and when an MP4 is the better choice.

Source: https://websitescrollvideo.com/guides/website-to-gif/ · Updated 30 October 2026 · Website Scroll Video

**The short answer:** Paste the page’s URL into a tool that exports GIF, such as Website Scroll Video, keep the scroll under 20 seconds at 720p or 1080p and 24 fps or less, and export. GIFs are the right choice where video will not play, such as email and some docs; everywhere else an MP4 or WebM of the same scroll is sharper and many times smaller.

## When a GIF is the right format

GIF is an old format with a 256-colour palette per frame and compression that was never designed for moving photographs. A scroll of a modern website, with its gradients and images, is close to the worst case for it. It survives because it plays almost everywhere, with no player, no click and no autoplay rules.

- **Use a GIF** in an email to a client or a newsletter, in a GitHub README or issue, in docs and wikis that do not embed video, and in chat apps that preview GIFs inline.
- **Use an MP4 or WebM** on your own website, in social posts, in portfolios and anywhere a `<video>` tag works. Same motion, better colour, a fraction of the size.

## Make the GIF

1. **Paste the URL.** On the [home page](https://websitescrollvideo.com/), paste the address and let the page load. Cookie banners and chat widgets are cleared before anything is captured.
2. **Choose GIF as the format.** The settings that a GIF cannot carry are capped for you: 24 fps at most, 1080p at most, and 20 seconds at most.
3. **Keep it short and gentle.** Trim the scroll to the part of the page that matters and keep the motion slow. At 24 fps, a fast scroll smears text in a way a viewer notices more in a GIF than in a video.
4. **Preview, then export.** The preview is free. Export when it looks right, and the GIF downloads like any other file.

## Keeping the file small

GIF size grows with every pixel, every frame and every colour that changes. In rough order of effect:

| Setting | Smaller file | Why |
| --- | --- | --- |
| Resolution | 720p rather than 1080p | Fewer than half the pixels per frame |
| Length | 6 to 10 seconds | Every second is another 24 full frames |
| Frame rate | 24 fps or lower | GIF has no motion compression to speak of |
| Background | A flat colour, no grain | Film grain and photos change every pixel on every frame |
| The page | Shorter scroll range | Less movement per frame, fewer new pixels |

> **Check your destination’s limit.** Email clients, chat apps and code hosts each set their own maximum attachment or image size. If a GIF is too large, shorten it before lowering the resolution: a sharp six-second GIF is better than a blurry fifteen-second one.

## Other ways to make a website GIF

- Record the screen and convert the recording to GIF with a converter or a tool like ffmpeg. Works for private pages; the scroll is only as even as your hand.
- Scripted capture with Puppeteer or Playwright, taking screenshots as the page scrolls and assembling them. Full control, and code to maintain.
- Free online URL-to-GIF tools. Several exist, with fewer settings; [the alternatives page](https://websitescrollvideo.com/alternatives/) compares the ones that also make video.

## Questions

### How do I make a GIF of a website scrolling?

Paste the URL into a URL-to-video tool that exports GIF, keep the scroll short, and export. Or record your screen while a script scrolls the page and convert the recording to GIF.

### Why is my website GIF so large?

GIF stores nearly every frame in full, so resolution, length and frame rate multiply together. Drop to 720p, keep it under ten seconds, and avoid photographic or grainy backgrounds.

### Will a GIF play in an email?

In most mail apps, yes, which is the main reason to choose it. Some desktop clients only show the first frame, so make sure the first frame works on its own.