README

Write HTML. Render video. Built for agents.


  Studio |
  Quickstart |
  Showcase |
  Playground |
  Catalog |
  Docs |
  Discord



  



  Download the desktop app:
  macOS ·
  Windows ·
  Linux (.deb)


HyperFrames is a free, open-source framework for turning HTML, CSS, media, and seekable animations into deterministic MP4 videos. Use it locally with the CLI, from AI coding agents with skills, or as the rendering core behind hosted authoring workflows.

The HyperFrames Studio app is free to use as well; its Pro plan adds HeyGen's top video, image, voice and music models.

Using Claude Code, Codex, Cursor, or another coding agent? Run npx hyperframes skills update once, then ask your agent to make a video.

 Quick Start

 With an AI coding agent

For Claude Code, install the versioned plugin:

bash
claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes


To enable auto-update for the hyperframes marketplace, run claude in a
terminal in your project. In Claude Code's terminal UI, run /plugin, then select
Marketplaces → hyperframes → Enable auto-update. Afterward, use
/hyperframes:hyperframes. See the plugin guide
for Copilot, VS Code, Cursor, Gemini CLI, updates, and migration.

For standalone skills (including OpenCode), use:

bash
npx skills add heygen-com/hyperframes


 The picker opens with nothing pre-selected — the Core Skills group is all you need; /slideshow, /remotion-to-hyperframes and /figma install on demand. Without the picker (a script or a CI job), npx hyperframes skills update installs exactly the core set, whereas skills add --all installs all 9 published skills. The six repo-internal skills under .claude/skills / .agents/skills are excluded by default. For the full published set use npx hyperframes skills.

 skills add resolves the skills.sh registry blob, which can lag main by hours. npx hyperframes skills update installs the skills from the release tag that matches your CLI version, so they match the CLI that runs them.

Run project-local installs from your video project's directory. From a HyperFrames
checkout, use npx hyperframes skills update for a global install instead: a
project-local installer target can overlap the tracked skills/ source and
overwrite uncommitted edits. See contributor setup.

Try a prompt like:

 Using /hyperframes, create a 10-second product intro with a fade-in title, a background video, and subtle background music.

The skills teach agents the HyperFrames production loop: plan the video, write valid HTML, wire seekable animations, add media, lint, preview, and render. They work with Claude Code, Codex, Cursor, Gemini CLI, IBM Bob, and other coding agents that support skills.

 Skills

HyperFrames ships 9 skills. Make any video by asking for it; the /hyperframes skill carries the contract and the references (film, captions, overlays, motion, look). Read it first.

For standalone installation, default to the core set (/hyperframes, /hyperframes-cli, /hype

Top issues

Discussions

Latest release

HyperFrames v0.9.25

Released on 2026-11-08.

Re-rendering a film with the same settings now gives the same result, because every render seeds its random values. A muted video's picture also no longer waits on its own audio track at a cut, and check replays an unchanged project's last pass.

 Features

- CLI: Check replays an unchanged project's last pass and takes --no-craft (070b964d7, 7398).

 Fixes

- Core: A muted video's picture no longer waits on its own audio track at a cut (fa2e63515, 7412).
- Producer: Seed random values in every render so re-renders give the same film (eb16510a1, 74