HyperFrames is an open-source TypeScript framework that turns HTML, CSS, media and seekable animations into deterministic MP4 video. It is built for developers who already generate web pages from code and want a video file out the other end, and especially for AI coding agents: an agent can write markup and styles all day, but it has had no straightforward way to hand back a finished clip. The project is published by the heygen-com organization under the Apache-2.0 license and is distributed on npm as hyperframes.
What it does
HyperFrames treats a web page as the source format for a video. You write the frame the way you would write any other page — layout in HTML, styling in CSS, images and audio as ordinary media, motion as animation the renderer can seek through — and the framework renders that into an MP4. There is no editor and no timeline to drag clips around in; the output is produced from the source every time, and the README stresses that the result is deterministic, so the same input yields the same video.
The README describes three ways the project is meant to be used:
- locally, through its command-line interface;
- from AI coding agents, by installing the HyperFrames skills;
- as the rendering core behind hosted authoring workflows.
Around the framework the project runs a documentation site with a quickstart, a showcase of rendered examples, a browser playground and a catalog of ready-made blocks — the catalog link in the README points at a data-chart block, which suggests the building pieces are aimed at the kind of explainer and data video people render again and again.
How it works
The README stops short of walking through the pipeline, but the repository's own topic list names puppeteer, ffmpeg and gsap alongside html, animation and rendering, which describes the shape clearly enough: a headless browser draws the page, and an encoder turns the resulting frames into an MP4. The word that matters is "seekable". Rather than screen-recording a page in real time and hoping the machine keeps up, a renderer that can move an animation to an exact timestamp can draw frame number N as often as it likes and always get the same pixels. That is what makes the output reproducible, and reproducibility is what makes video safe to generate from a script or a scheduled job instead of by hand.
The mcp topic points at the other half of the design, the agent integration. As the video puts it, HyperFrames works with Claude Code, Cursor and Codex; the agent installs it straight from the CLI, takes one prompt describing the video, and then plans it, writes the code and renders the file.
Getting started
The package is on npm as hyperframes, and the badges in the README ask for Node.js 22 or newer. From there the two documented entry points are the CLI, for running renders yourself, and the skills install, for handing the job to a coding agent. The docs site carries the quickstart, and there is a public playground if you would rather watch a render happen before installing anything. The project also runs a Discord server, and the Apache-2.0 license is permissive enough to embed the renderer inside a commercial product.
When to use it / when not
It fits when the video is generated rather than filmed: product explainers, release notes, dashboards and chart animations, personalised clips — anything where the content comes from data or from code and the same template gets rendered again next week. It fits especially well when an agent is doing the work, because HTML is the one visual format that current coding models are genuinely fluent in.
It is the wrong tool if you are cutting footage, grading colour or shaping audio; there is no editor here, by design. It is also not a generative video model — it renders exactly what you authored, nothing more. And because the pipeline leans on a headless browser and an encoder, it expects a machine where Node 22 and those binaries can actually run, which rules out some locked-down environments.
Alternatives
The materials for this entry name no competitors, so treat this as context rather than a comparison. The usual routes to a programmatic video are a GUI editor driven by hand, a hand-written ffmpeg command chain, or a screen recording of a page playing in a browser. The first does not automate, the second is painful to author and to review in a pull request, and the third is not reproducible. The HyperFrames pitch is that the source of truth stays a web page you can diff, review and regenerate.
Developers who have to emit video as an output of software — marketing pipelines, documentation that ships with motion, dashboards that go out as clips — should take this seriously, and so should anyone wiring coding agents into a content pipeline, since it closes the last gap between an agent writing a page and an agent delivering a video. The repository has gathered roughly 46,700 stars and 4,300 forks since it first appeared in March 2026, with commits continuing through September, so the attention is real and the project is active; it is also young, which is the usual reason to pin a version and expect the API surface to keep moving for a while.