HyperFrames review

Q: How do I install HyperFrames?

Run npx hyperframes skills update. It needs Node.js >=22. The install section above has the other options from the project's README.

HyperFrames is an open-source framework that turns HTML, CSS, media, and seekable animations into deterministic MP4 videos, built for AI coding agents.

Updated Nov 1, 2026. Review written Oct 25, 2026 from the project's own sources; usage data refreshed every Monday.

TL;DR

HyperFrames is an open-source framework from HeyGen for rendering HTML compositions into MP4 video. It targets developers and AI coding agents such as Claude Code, Codex, and Cursor. Compositions are plain HTML with data attributes and need no build step or React, and the same input produces the same frames.

76.6kGitHub stars
+5.2knew stars, week of Oct 25
~1.5Mdownloads a week, +67% vs 4-week avg
#2in Agent frameworks this week

HyperFrames at a glance

Category: Agent frameworks
Maintained by: HeyGen (organization, @heygen-com on GitHub)
License: Apache 2.0
Language: TypeScript, JavaScript, Shell
Repository: github.com/heygen-com/hyperframes
Website: hyperframes.dev
npm package: hyperframes 0.8.200
Latest release: v0.8.200 on GitHub, Oct 25, 2026
First published: Mar 10, 2026

What HyperFrames does

HyperFrames renders HTML, CSS, media, and seekable animations into deterministic MP4 videos.
HyperFrames ships agent skills that teach coding agents to plan, write HTML, animate, add media, lint, preview, and render videos.
HyperFrames supports GSAP, CSS, Lottie, Three.js, Anime.js, WAAPI, or a custom frame adapter for seekable animation.
HyperFrames offers a catalog of about 450 ready-made blocks such as transitions, overlays, captions, charts, and maps, installed as editable source.
HyperFrames can render locally, in Docker, or through a distributed AWS Lambda render stack.
HyperFrames includes Studio, a browser surface for previewing and editing compositions, and an embeddable player web component.
HyperFrames provides frame.md, which converts a web design system into a DESIGN.md superset an agent can compose video from.

How it works

HyperFrames defines a video as HTML with data attributes for timing and tracks. You preview it in the browser with live reload. To render, the engine seeks each frame in headless Chrome via Puppeteer and encodes the result with FFmpeg, so the same input gives the same video. You can drive it with the CLI or from coding agents through installed skills or plugins.

How to install and start using HyperFrames

Agent skills (core set)

npx hyperframes skills update

Standalone skills picker

npx skills add heygen-com/hyperframes

Requirements

Node.js 22 or later
FFmpeg

First steps

Scaffold a project with `npx hyperframes init my-video`, then `cd my-video`.
Run `npx hyperframes preview` to preview the composition in the browser with live reload.
Run `npx hyperframes render` to render the composition to MP4.
Or ask your agent, using `/hyperframes`, to create a short product intro with a title, background video, and music.

Who HyperFrames is for

Developers using Claude Code, Codex, Cursor, or Gemini CLI to generate videos from prompts.
Automated content pipelines and CI that need deterministic, repeatable video renders.
Product launch videos, PR walkthroughs, data visualizations, and social videos with captions.
Teams that want to author video in plain HTML rather than React components.

Limitations to know

HyperFrames requires Node.js 22+ and FFmpeg installed locally.
HyperFrames Studio is marked as available but still evolving.
HyperFrames animations must be seekable, through a supported adapter or a custom frame adapter.
HyperFrames skills installed via `skills add` can lag the main branch by hours.

Is HyperFrames growing? Usage data

In the week of Oct 25–31, 2026, HyperFrames ranked #21 on the Devtoolwatch Board and #2 in Agent frameworks, with a momentum score of 90 out of 100. Its main package had about 1.5M downloads that week, +67% against its own 4-week average.

New GitHub stars per week for the last 12 weeks, from GitHub's stargazer history (today's stargazers by the week they starred).

Show the weekly numbers

New GitHub stars per week for HyperFrames
Week of	New stars
Aug 9, 2026	1k
Aug 16, 2026	1k
Aug 23, 2026	979
Aug 30, 2026	1.1k
Sep 6, 2026	5k
Sep 13, 2026	2.5k
Sep 20, 2026	1.7k
Sep 27, 2026	3k
Oct 4, 2026	4.1k
Oct 11, 2026	5.8k
Oct 18, 2026	5.5k
Oct 25, 2026	5.2k

On Hacker News

Show HN: HyperFrames – Render Video from HTML via Chrome's BeginFrame API, 6 points and 0 comments (Apr 16, 2026)

The Board ranks tools by four signals each week: new stars, new stars for the repo's size, added downloads and download growth beyond the market. How the ranking works.

HyperFrames alternatives

Other AI agent frameworks on the Board in the week of Oct 25–31, 2026, by momentum:

Agent frameworks ranked by momentum, the week of Oct 25–31, 2026
Rank	Tool	Stars	Downloads/wk
#1	Harness²Harness² is a Python framework from Google Research for recursive agent harnessing, refining an agent's prompts, tools, memory and…	21.7k	–
#3	AgentScopeAgentScope is a Python agent framework with an SDK for building ReAct agents and an agent service backend with a web UI.	35k	51.4k
#4	AG-UIAG-UI is an open, event-based protocol that standardizes how AI agents connect to user-facing frontend applications.	16.9k	4.6M
#5	LangGraphLangGraph is a low-level orchestration framework and runtime for building, managing, and deploying long-running, stateful agents in…	44.2k	18.5M
#6	BifrostOpen-source, high-performance AI gateway that works as your LLM gateway, MCP gateway and agent gateway. One OpenAI-compatible API for…	9.3k	–
#7	assistant-uiassistant-ui is an open-source TypeScript/React library of composable primitives and runtimes for building AI chat interfaces in your app.	12.9k	2.8M

All AI agent frameworks, ranked

Recent HyperFrames releases

v0.8.200, Oct 25, 2026
v0.8.199, Oct 25, 2026
v0.8.198, Oct 25, 2026
v0.8.197, Oct 25, 2026
v0.8.196, Oct 25, 2026

HyperFrames FAQ

Is HyperFrames free and open source?

Yes. HyperFrames's source code is on GitHub (heygen-com/hyperframes) under the Apache 2.0 license, so you can use it for free.

How do I install HyperFrames?

Run npx hyperframes skills update. It needs Node.js >=22. The install section above has the other options from the project's README.

Is HyperFrames still maintained?

Yes. The heygen-com/hyperframes repository was last updated on Oct 25, 2026, and the latest release, v0.8.200 on GitHub, came out on Oct 25, 2026.

How popular is HyperFrames?

HyperFrames has 76.6k GitHub stars as of Nov 1, 2026. It gained 5.2k new stars in the week of Oct 25–31, 2026, against a 12-week average of 3.1k a week. Its main package had about 1.5M downloads that week, +67% against its own 4-week average. That made it #2 among AI agent frameworks on the Devtoolwatch Board.

What are the best alternatives to HyperFrames?

Other AI agent frameworks on the Devtoolwatch Board in the week of Oct 25–31, 2026, by momentum: Harness² (#1), AgentScope (#3), AG-UI (#4), LangGraph (#5), Bifrost (#6). The alternatives table above has their numbers.

What is HyperFrames by HeyGen?

HyperFrames is an open-source framework from HeyGen that turns HTML, CSS, media, and seekable animations into deterministic MP4 videos. You can use it locally with the CLI, from AI coding agents with skills, or as the rendering core behind hosted authoring workflows.

What is HyperFrames used for?

HyperFrames is used for product launch videos, PR walkthroughs with animated code diffs, data visualizations and map animations, social videos with kinetic captions, docs-to-video explainers, and reusable motion graphics for automated content pipelines.

How do I use HyperFrames with Claude Code?

HyperFrames installs into Claude Code as a versioned plugin with claude plugin marketplace add heygen-com/hyperframes and claude plugin install hyperframes@hyperframes. Then use /hyperframes:hyperframes and ask for a video.

How do I use HyperFrames with Codex or Cursor?

HyperFrames works with Codex, Cursor, and other skill-capable agents. Run npx hyperframes skills update once to install the core skills, then ask your agent to make a video. A Codex plugin archive can also be built for upload.

Is HyperFrames deterministic?

Yes. HyperFrames seeks each frame in headless Chrome and encodes with FFmpeg, so the same input produces the same frames and output. The project describes this as built for CI, regression tests, and automated rendering.

Sources

HyperFrames README badge

Maintainers can show the tool's weekly Board rank in their README:

[![Devtoolwatch](https://index.devtoolwatch.com/badge/heygen-com-hyperframes.svg)](https://index.devtoolwatch.com/tools/heygen-com-hyperframes/)

How this page is made: Devtoolwatch writes each review from the project's README, releases, package metadata and website, with an AI model, then checks every claim against the source it cites and drops what the sources don't support. The numbers come from Devtoolwatch's daily GitHub snapshots, GitHub's stargazer history, and the npm and PyPI download APIs. Spotted an error? Email [email protected].