Video Trimmer
Scrub, set in and out points, and export the clip in the browser.
AdvancedWeb appMedia16–32hAI-buildable 2/5needs backend
Trim a video entirely client-side: a frame-accurate timeline with draggable handles, thumbnail strip, and export. No upload, no server. Generating the thumbnail filmstrip by seeking and capturing frames is the part that makes it feel like a real editor.
UI
Logic
Useful
Hosting · Free tier, sleeps when idle
Deploys free on Vercel Hobby + Supabase free or Cloudflare Pages + Turso free.
Free database tiers pause or expire when a project sits idle, so this one needs occasional attention to stay up.
Deploy it and share a link.
Core features · 7
- Load a video file locally with no upload
- A timeline with draggable in and out handles
- A thumbnail filmstrip generates along the timeline
- Preview plays only the selected range
- Frame-stepping controls for precise trim points
- The trimmed clip exports as a downloadable file
- Long videos don't freeze the tab while thumbnails generate
The interesting part
- Generating thumbnails requires seeking and capturing frames one at a time
- Frame-accurate seeking is unreliable across formats
- Encoding in the browser is expensive and needs a worker
Once it works
- Add multiple segments joined into one export
- Add audio waveform display on the timeline
- Add a GIF export option
Suggested stack
reacttypescripttailwindcanvas-api