What Is html-video? The Open-Source HTML-to-Video Project, Explained (2026)
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.