What OpenVid Actually Is
Demo videos are the part of shipping nobody budgets for. You record your screen, and what you get is raw footage: a flat window, a dead background, no emphasis anywhere. Then comes the editing, the motion graphics, the export settings, and the three hours you did not have. OpenVid exists to collapse that whole pipeline into one browser tab.
It is a free, open-source web app, built with Next.js and TypeScript, purpose-built for one job: turning a screen recording or an uploaded video clip into a polished product demo. Record your screen directly in the browser or upload an MP4, WebM, QuickTime or MKV file, then add device mockups, 3D transformations, smooth cinematic zooms and one of more than a hundred pre-designed backgrounds. When it looks right, export up to 4K MP4.
The part that matters most is where the work happens. Everything renders in your browser. The video processing runs on FFmpeg.wasm, the 3D effects on Three.js, the preview on the Canvas API, with MediaBunny optimising the pipeline. Recorded videos are stored in IndexedDB on your own machine and settings live in LocalStorage. Nothing about the architecture requires your footage to travel to someone else's server, which is the correct default for a tool whose entire input is your unreleased product.
The Workflow: Record, Stage, Zoom, Export
OpenVid organises itself the way a demo actually gets made.
Video input. Two doors in: capture your screen straight from the browser with no installation, or upload an existing clip. Supported uploads are MP4, WebM, QuickTime and MKV, which covers screen recordings from every major OS.
Mockup creation. This is the stage most screen recorders skip. Drop your recording into a device mockup, apply 3D transformations to tilt and angle it, and the flat capture starts reading as a product shot. The README also lists mockups applied to still images, so the same stage works for screenshots you want to feature.
Visual customisation. More than 100 pre-designed backgrounds, plus the option to bring your own image, pull from Unsplash, or use solid colours and gradients. On top of the canvas you can layer shapes, text with custom fonts and colours, imported SVG graphics and image overlays in PNG, JPG and WebP. If you are matching a brand palette on a background or overlay, our Color Converter turns the hex you were handed into RGB and HSL without a round trip through a design tool.
Zoom. Zoom in and out at specific timeline moments with speed and easing control. Then the signature move: a 3D virtual camera that tilts and rotates dynamically based on points of interest. This is what separates a demo that looks recorded from one that looks directed.
Audio. Multi-track support with auto-trim that cuts the audio to the video duration, so the voiceover or music never dangles past the last frame.
Export. Quality from 480p up to 4K at 30fps, in MP4 (H.264), WebM (VP9, with transparent background support), GIF, or still frames in PNG, WebP, JPG and AVIF. The GIF and WebM-with-transparency options are the quiet winners here: they cover the looping demo clip on a README or landing page, which is where most demo videos actually end up being watched.
The 3D Camera Is the Killer Feature
Every demo tool has zoom. OpenVid's version deserves the paragraph because of how it moves.
A normal zoom is a scale animation: the frame gets bigger around a point. OpenVid's 3D camera, built on Three.js, adds tilt and dynamic rotation that follows points of interest across the timeline. The camera does not just magnify; it reframes, the way a person holding a camera would. Combined with the easing controls, the result reads as directed footage rather than a screen capture with effects bolted on.
This is also where the device mockups earn their keep. A flat recording zoomed in is just a bigger flat recording. A recording sitting inside a tilted device mockup, with the 3D camera sweeping across it, is a product shot. The combination is the whole pitch of the tool: it manufactures the production value that usually requires After Effects and an afternoon.
Everything Renders in Your Browser, Including the Privacy Story
The technology section of the README reads like a deliberate bet on the browser as a workstation: FFmpeg.wasm for fully in-browser rendering, Canvas API for the preview, MediaBunny for an optimised video pipeline, Three.js for the 3D effects, and an HTML-to-Image step for mockup export.
The practical consequence is privacy by architecture. Your recordings sit in IndexedDB, your settings in LocalStorage, and the render never has to leave your machine. Supabase cloud backups are listed as coming soon, which means today the tradeoff is explicit: no cloud project syncing, but also no upload step and no account required to start.
That same bet sets the ceiling. Browser-based rendering leans on your machine, so a 4K export of a long timeline will ask for real CPU and memory. For the tool's actual use case, short product demos and feature clips, that is the right tradeoff. If you are cutting a twenty-minute tutorial, this is not your editor, and it does not pretend to be.
Getting Started: Try It Live, or Self-Host in One Command
The fastest route needs no install at all: there is a live demo at openvid.dev, so you can record something and judge the output before touching a terminal.
Self-hosting is the standard Next.js drill:
pnpm installcp .env.example .env (then add your Supabase credentials)pnpm dev
Open http://localhost:3000 and you are in. The .env.example step is there for the planned Supabase cloud backups; the core editor runs without it.
Two practical notes before you export for a specific surface. If the demo is headed for a README or a social post, check the destination's preferred dimensions first with our Aspect Ratio Calculator: a 4K export cropped wrong is just a large wrong file. And if you need to embed a small asset as a data URI in a page, Base64 encode does it in one step.
The Honest Limitation: No License File, and a Young Project
Two caveats, and the first one is the important one.
The repository currently ships no license file. GitHub reports the license as unasserted, which means there is no explicit grant of reuse rights attached to the code, whatever the README's "open source" framing suggests. The source is public and you can read, run and learn from it, but if you plan to use it commercially, fork it, or build on it, that missing file is a real gap: check with the author first. This is worth stating plainly because the rest of the project invites you to treat it as freely reusable.
The second caveat is youth. The repository was created in February 2026, the contributor graph is small, and cloud backup is still a roadmap item. The Discord community exists and contributions are welcome, which is the right shape for a project at this stage, but expect the occasional rough edge and a feature set that is still growing into its ambition. The export format list already covers the realistic needs; the risk is in the long tail, not the core.
Repo Health: 2,684 Stars and a Steady Pulse
The repository was created on 10 February 2026 and sits at 2,684 stars with 384 forks at the time of writing; the latest push landed on 28 September 2026, five days before this page went up. The star count has roughly tripled since the spring, which for a niche dev-tool is the healthy pattern: slow, compounding discovery rather than a launch-day spike.
Good fit if you ship software and need demo videos, feature clips or landing-page loops, and you would rather do it in a browser tab than learn a video editor or pay for a cloud rendering service.
Poor fit if you need long-form editing, collaborative cloud projects today rather than when the Supabase backup lands, or you require a clear license grant for commercial use. Check the license situation first, then decide.
