mockvid
Three ways to turn a website into a video
"Website to video" covers three very different tools. Which one fits depends on what you want the video to show.
| Screen recording | AI "URL to video" tools | Mockvid | |
|---|---|---|---|
| What the video shows | Your screen while you browse the site | A slideshow built from the page's text and images | The real site, as visitors see it |
| Cursor and browser bars | In frame | No recording | None |
| Scroll | Follows your hand, uneven | No recording | Smooth and steady |
| Mobile version | A second session | No recording | Same capture as desktop |
| Editing afterwards | Crop, trim, frame | Script and scene review | None required |
| Best for | Walkthroughs with your voice | Narrated explainers from content | Showing the design and build itself |
If the point of the video is the website itself (its design, its motion, how it scrolls on a phone), you want the site recorded, not described. That is what Mockvid does: a website video generator that records the real page, then stages it.
How to convert a website to a video
- Enter the URL. Any public site or staging link works. If a site blocks automated browsers, you can upload your own screen recording instead.
- Let it capture. The page loads in a real browser on a desktop and a phone viewport. Cookie banners are hidden, lazy-loaded images get time to arrive, and the page scrolls at a constant speed. You preview the capture before rendering.
- Direct the video. Pick one of eighteen camera motions, a device finish, lighting and a backdrop. Add a title, your logo or music if you want them.
- Export. Choose the ratio (16:9, 9:16, 1:1, 4:5 or 4:3) and the format. 720p MP4 and WebM are free with a small watermark; a one-time unlock for the domain adds 1080p to 4K at 60fps, GIF, WebP and transparent video.
Try it on a site you know.Desktop and mobile captured together, free in 720p.
Open the generator →Pick the output: 3D showcase or plain scroll video
One capture gives you two kinds of video.
- A 3D showcase. The site plays on a laptop and a phone in a lit 3D scene, with a directed camera move. Ready to post, no edit needed. See the 3D website mockup video page, or the scrolling website mockup if the scroll is the star.
- A plain scroll recording. The page alone, edge to edge, desktop at 1920×1080 and mobile alongside, for your own edit in Premiere, Final Cut or CapCut. Downloading it requires the one-time $9 unlock for that domain. See website scroll recording.
Why a 3D showcase instead of a plain recording
A plain recording proves the site exists. A staged one makes people stop on it. Depth, light and a moving camera read as production value, the same way a product photo on a set reads differently from a phone snapshot. And because the staging is applied to a real recording, everything that moves on the site still moves in the video: scroll-triggered animations, parallax, video backgrounds.
The same scene also re-exports in every ratio without capturing the site again: a 16:9 version for the portfolio, a 9:16 one for Reels and Stories, a 4:5 one for the LinkedIn feed. For a deeper comparison, read 3D mockup vs static mockup.
What people make with it
- Portfolio pieces. Every shipped site, shown moving rather than as a screenshot. See Mockvid for web designers.
- Client handoffs and case studies. A short video that closes the project and doubles as the case-study asset. See the handoff video guide and Mockvid for agencies.
- Launch announcements. The landing page as a launch video for Product Hunt, X and LinkedIn. See how to make a Product Hunt launch video.
- Social posts. Vertical 9:16 exports for Reels, TikTok and Stories. See website mockups for Instagram.
- Responsive design presentations. Desktop and mobile in the same shot, from the same capture.
- Designs that are not live yet. On the Studio plan, a Figma frame goes through the same 3D scene. See Figma to 3D mockup video.
FAQ
How do I turn a website into a video?
Paste the website's URL into Mockvid. It opens the live site in a real browser, records it scrolling on desktop and mobile, and lets you stage the recording in a 3D scene with a camera motion, text and music. Then export it as an MP4 or another format, in the ratio you need.
Is there a free way to convert a website to video?
Yes. Mockvid exports 720p MP4 and WebM for free with a small watermark, with no account and no card. A one-time $9 unlock per domain removes the watermark and adds 1080p to 4K, 60fps, GIF, WebP, transparent video and the raw scroll recordings.
Can I convert a website to MP4?
Yes. MP4 (H.264) is the default export and plays everywhere: social platforms, decks, websites and video editors. WebM is also free; GIF, animated WebP and transparent video come with a paid unlock.
Does it work with animations and the mobile version of a site?
Yes. The site runs in a real browser, so scroll-triggered animations, parallax and video backgrounds play as they do live. Every capture records the desktop and the mobile layout in the same pass.
Is Mockvid an AI video generator?
No. It doesn't write a script, generate scenes or add a voice-over. It records your real website and stages that recording, so the video shows exactly what visitors see. If you need a narrated explainer built from a page's text, AI URL-to-video tools are made for that.