vercel-labs

Record scripted browser demos as video

115
3
100% credibility
Found Mar 02, 2026 at 114 stars -- GitGems finds repos before they trend. Get early access to the next one.
Sign Up Free
AI Analysis
TypeScript
AI Summary

Webreel is an open-source tool from Vercel Labs for generating scripted browser interaction videos as MP4, GIF, or WebM files with cursor animations, keystroke overlays, and sound effects from simple step descriptions.

How It Works

1
🔍 Discover Webreel

You stumble upon this handy tool while looking for ways to make smooth demo videos of websites, and love the polished example recordings with moving cursor and key press visuals.

2
🚀 Get set up fast

With one simple command, you install everything needed, including the browser tools and video maker, ready to go in moments.

3
📝 Plan your demo steps

You describe the actions like clicks, typing, scrolling, or drags in a straightforward list, just like scripting a short show.

4
🎥 Hit record

You launch the recording, and it automatically plays through your steps on the website, capturing every smooth movement.

5
👀 Preview live

If you want to check first, run it in a visible window to see the cursor dance and keys appear just right.

6
Add polish

Magic overlays for cursor glow, key labels popping up, and subtle sounds make your video feel professional and lively.

Share your video

You get a ready-to-share MP4, GIF, or WebM file perfect for tutorials, marketing, or docs, looking just like a pro screen recording.

Sign up to see the full architecture

5 more

Sign Up Free

Star Growth

See how this repo grew from 114 to 115 stars Sign Up Free
Repurpose This Repo

Repurpose is a Pro feature

Generate ready-to-use prompts for X threads, LinkedIn posts, blog posts, YouTube scripts, and more -- with full repo context baked in.

Unlock Repurpose
AI-Generated Review

What is webreel?

Webreel is a TypeScript CLI for recording scripted browser demos as polished MP4 videos, complete with cursor animations, keystroke overlays, and sound effects. Define interactions like clicks, drags, typing, and scrolls in a simple JSON config, and it automates headless Chrome to capture ~60fps screenshots before encoding via ffmpeg. Output webreels for marketing sites, docs, or tutorials without manual screen recording.

Why is it gaining traction?

Unlike raw Puppeteer scripts or tools like github record builder, webreel delivers production-ready videos out of the box—auto-adding smooth cursor motion, HUD labels for keys like "cmd+a", and subtle SFX for clicks and keystrokes. Commands like `npx webreel init`, `record`, `preview`, and `validate` make iteration fast, with mobile viewports, GIF/WebM export, and shared steps via includes. Extensive examples cover form-filling, drags, and multi-videos from one page.

Who should use this?

Frontend devs scripting UI walkthroughs, product marketers building landing page demos, and docs teams generating browser videos alongside screenshots. Ideal for teams using Vercel or Next.js who want scripted record automation without video editing tools.

Verdict

Solid early bet at 49 stars and 1.0% credibility—Vercel Labs polish shines in docs and examples, but low adoption means watch for edge cases. Grab it if you need quick, repeatable browser demo videos today.

(187 words)

Sign up to read the full AI review Sign Up Free

Similar repos coming soon.