What Is html-video? The Open-Source HTML-to-Video Project, Explained (2026)
What Is html-video? The Open-Source HTML-to-Video Project, Explained (2026)
July 13, 2026
Keston CollinsVideo editor with nearly 10 years of experience, exploring the intersection of motion graphics and AI.
A new name has been climbing GitHub's trending charts, and the search results for it are still almost entirely tutorials about the HTML <video> tag. This page is about the other thing: the open-source project called html-video, what it actually does, and where it fits next to tools you may already know.
What is html-video? The definition
html-video is an open-source tool that turns HTML, CSS, and structured data into real MP4 video files, rendered locally on your own machine. You describe the video you want, a coding agent such as Claude Code or Cursor writes a multi-frame storyboard as animated HTML, and a rendering engine records each frame in headless Chromium before ffmpeg encodes the result. The project is maintained by nexu-io as an official project of the Open Design team, it is licensed Apache 2.0, and it charges no per-render fees. The engine doing the actual rendering today is HyperFrames.
That last sentence matters, and most early coverage skips it, so we will come back to it in a moment.
The basics, verified from the repo
Everything in this section comes from the public repository (github.com/nexu-io/html-video) and the project's official page (open-design.ai/html-video). We have not run the full pipeline ourselves, so treat this as a documented map, not a hands-on review.
Question
Answer
What is it?
An HTML-to-video meta-layer for coding agents
Who made it?
nexu-io, the Open Design team (the group behind open-design.ai)
First published
May 27, 2026
Traction
3,958 GitHub stars and 498 forks as of July 13, 2026
License / cost
Apache 2.0, free, local rendering, no per-render fees
Rendering engine
HyperFrames (shipped); Remotion, Motion Canvas/Revideo, and Manim listed on the roadmap
Templates
21 curated, license-clean video templates
Extras
Optional AI soundtrack (music and narration) through the MiniMax API
Requirements
Node.js 20+, pnpm 9+, ffmpeg, Chromium via Playwright
Built for
Coding agents and the developers who run them
The star curve is worth a note. The repository went from zero to nearly 4,000 stars in about seven weeks, which for a developer video tool is fast. For comparison, that early trajectory resembles what HyperFrames itself did when HeyGen released it earlier in 2026.
How html-video works
The pipeline has six steps, and once you see them the whole project makes sense.
Source in. You point it at an article, a URL, a GitHub repo, or a plain description. Sources get converted to Markdown.
Storyboard. Your coding agent reads the content and writes a multi-frame storyboard: which points become which frames, in what order.
Content graph. The storyboard becomes a structured intermediate representation, so frames can be edited and reordered before anything renders.
Frames as HTML. Each frame becomes a self-contained animated HTML page, using CSS and GSAP for motion. The 21 built-in templates cover data visualization, product promos, explainers, and cinematic title frames.
Record. The HyperFrames engine opens each frame in headless Chromium and captures it frame by frame.
Encode. ffmpeg (libx264) stitches the captures into a real MP4 on your disk. No cloud render queue, no watermark, no metered API.
The repo's README describes the design goal as one render(input, ctx) contract that any backend can satisfy, which is why the roadmap can list Remotion and Manim as future engines without rewriting the templates.
The agent support is broad by design. The README lists more than a dozen coding agents that the tool auto-detects, including Claude Code, Cursor, Copilot, and Gemini CLI. You bring whichever agent you already pay for; html-video does not ship its own model and does not require an extra API key for the core pipeline.
html-video and HyperFrames: the meta-layer and the engine
Here is the relationship that the name hides. html-video is not a rendering engine. It is a meta-layer that sits on top of one. The engine underneath, the thing actually seeking frames in headless Chrome and handing them to ffmpeg, is HyperFrames, the open-source HTML-to-video framework HeyGen released earlier this year.
So the stack reads like this: you talk to a coding agent, the agent talks to html-video, html-video builds storyboards and HTML frames, and HyperFrames renders them. What html-video adds on top of the raw engine is the content-to-storyboard workflow, the template library, and the multi-engine abstraction. What HyperFrames contributes is the deterministic rendering core, plus several of the Apache 2.0 templates in the gallery.
If you want the deeper story on that engine layer, including how it stacks up against the React-based incumbent, we cover it in HyperFrames vs Remotion. The short version: HyperFrames renders from plain HTML, Remotion renders from React, and both drive headless Chrome plus FFmpeg underneath.
html-video vs HyperFrames vs Remotion
Three names, three different altitudes. This table is the fastest way to keep them straight.
html-video
HyperFrames
Remotion
What it is
Content-to-video meta-layer
HTML rendering engine
React rendering framework
You provide
An article, repo, or description
HTML + CSS + animation code
React components
Who writes the code
Your coding agent, mostly
You or your agent
You or your agent
Engine underneath
HyperFrames today, more planned
Itself
Itself
Templates
21 built in
Examples and starters
Community + paid ecosystem
License
Apache 2.0
Apache 2.0
Business-source, paid above revenue limits
Maintainer
nexu-io / Open Design team
HeyGen
Remotion GmbH
Best fit
Turning existing content into video fast
Building custom motion scenes as code
React teams with video pipelines
One way to read the table: Remotion and HyperFrames compete at the engine layer, while html-video competes at the workflow layer above them, and today it happens to route its work through HyperFrames.
What developers are saying
Because the project is only weeks old, third-party commentary is thin, but it exists. The most substantial early write-up we found is on the developer blog silenceper.com (June 5, 2026), which frames html-video as an answer to a real adoption problem: tools like Remotion and Motion Canvas each come with their own authoring model, so you first have to choose a framework, learn it, and understand its rendering pipeline before you produce anything. The author's read is that html-video "tries to move that complexity behind a higher-level workflow" by letting the connected agent handle content analysis, template selection, and frame generation.
The same write-up is candid about the project's maturity. As of early June, "the truly runnable core is the Hyperframes engine," with the other engines still roadmap items. The verdict there was that the project is worth following, particularly for content that already has clear structure and needs to become video quickly. Beyond that, distribution so far has been mostly link-sharing on X and GitHub trending lists rather than long-form reviews, which is typical for a repo this young.
Who html-video is for, and who it is not for
Based on the repo docs and the maintainers' published material, the honest split looks like this.
html-video is for you if you are a developer, you already run a coding agent day to day, and your videos are downstream of content you have in text form: changelogs, blog posts, product docs, data. You get a local, free, scriptable pipeline, and every video is a build artifact you can version and regenerate. The cost is the toolchain. You need Node, pnpm, ffmpeg, and Playwright's Chromium installed, and when a render misbehaves, someone has to read the output and fix it like any other build failure.
It is not for you if you want a finished branded clip and you do not want to touch a terminal. html-video assumes an agent-plus-repo workflow. There is no drag-and-drop editor, no brand kit, and no human-facing preview app; the interface is your coding agent.
For that second group the relevant category is a Motion Agent: you describe the clip in plain language, the system matches a market-tested template, fills in your content, and hands you a finished export in minutes. That is the job AutoAE does as a video creation platform, and it is a different job from html-video's. One serves developers who want video as part of a code pipeline; the other delivers finished motion graphics to people who will never clone a repo. Plenty of teams will eventually use both, a pipeline for automated content video and a platform for the hooks and promos that need to look hand-finished.
FAQ
Is html-video the same thing as the HTML <video> tag?
No. The <video> tag is a browser element for playing existing video files on a web page. html-video is a separate open-source project (github.com/nexu-io/html-video) that creates new MP4 files from HTML and CSS. The name collision is unfortunate, and it is why searching the term mostly returns tag tutorials right now.
Is html-video free?
Yes. It is licensed Apache 2.0 with no per-render fees, and rendering happens on your own machine. Your real costs are the coding-agent subscription you already have, plus local compute. The optional AI soundtrack feature calls the MiniMax API, which is a separate service.
Does html-video generate video with AI?
Not in the Sora or Veo sense. No model paints the pixels. An AI agent writes the storyboard and the HTML, then a browser renders exactly what that markup describes, deterministically. The output is motion graphics, not generated footage.
What is the difference between html-video and HyperFrames?
HyperFrames is the rendering engine: it turns an animated HTML file into an MP4. html-video is the workflow layer above it: it turns content into storyboards and HTML frames, then hands them to HyperFrames to render. html-video plans to support other engines, including Remotion, but as of July 2026 HyperFrames is the one that ships.
Can non-developers use html-video?
In practice, no. You need a working Node and ffmpeg setup and a coding agent, and troubleshooting happens at the command line. If you want the outcome without the toolchain, a Motion Agent platform such as AutoAE covers that side: plain-language input, branded templates, finished MP4 out, starting at $9.90 per month or $2.90 per single export.
