PlugWiki

HyperFrames by HeyGen: HTML-to-video plugin and skills for Claude Code

Teaches Claude Code to build videos as HTML and render them to MP4 with HeyGen's open-source HyperFrames.

Skills
8
included
Stars
77.1K
on GitHub
Included
7
listed

The HyperFrames plugin makes Claude Code write a video as an HTML file, check it, and render it to an MP4 on your own machine. It is a set of skills from HeyGen that teach the loop: plan the video, write the HTML, add animation and media, lint, preview and render. Start with the hyperframes skill, which covers the rules every video must follow. It is free, and only HeyGen media such as avatars or generated clips uses credits.

Good for

  • Developers who want agent-made product intros and explainers
  • Marketers making templated or repeatable video
  • Designers turning Figma frames into motion
  • Teams moving Remotion or Lottie work to plain HTML
  • Anyone who wants free, Apache 2.0 video tooling

Install hyperframes

Claude Code

  1. 1

    Copy this prompt.

    Install the hyperframes plugin in Claude Code. Run this command:

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

Then check that it loaded and tell me how to use it.
  2. 2

    Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js 22 or later, FFmpeg.

HeyGen's own marketplace gets new versions first; the official marketplace copy is pinned to an older commit. If you installed the older core-skills plugin, remove it after installing this one with claude plugin uninstall core-skills@hyperframes. Run npx hyperframes doctor to check that FFmpeg and the rest are in place.

From the project README. Source.

Key facts

Author
HeyGen
License
Apache-2.0
Version
0.8.230, released 2026-11-02
Created
npm package first published 2026-03-23; open-sourced April 2026
Contains
8 skills (7 published, 1 internal). No hooks, MCP servers, commands or agents. Registry blocks are not plugin skills.
Works in
Plugin: Claude Code, Copilot CLI, VS Code, Cursor, Gemini CLI. Skills only: Codex, OpenCode. Claude app: separate hosted connector
Requires
Node.js 22+, npm, FFmpeg; the CLI downloads headless Chrome
Official marketplace
Listed as hyperframes in claude-plugins-official, pinned to a 2026-09-22 commit, older than HeyGen's own marketplace
Cost
Free; HeyGen media (avatars, generated clips) uses credits

What it includes

  • Start here: the render rules, work loop and video types

    Read first for any video. It sets the rules a HyperFrames video must follow and the loop to build it, and covers launch films, explainers, captions and overlays.

    Try: “Using /hyperframes:hyperframes, make a 5-second title card that says "Hello world".”

    Runs code · /hyperframes:hyperframes

  • Scaffold, check, preview and render from the CLI

    Teaches the agent the CLI by job: create a project, lint, look at frames, edit the timeline, preview, render locally or in the cloud, publish and recover from failures.

    Try: “Render this project to MP4 and check the frames.”

    Runs code · hyperframes-cli

  • About 450 ready-made blocks and components

    Installs transitions, overlays, titles, captions, charts, maps and 3D blocks into your project as editable source.

    Try: “Add a lower-third and a fade transition from the registry.”

    Write · hyperframes-registry

  • Get or make music, voiceover, images and more

    Finds or makes music, sound effects, images, logos, voiceover, avatar video, transcripts, cutouts and colour grades, using HeyGen or free local tools. Some HeyGen media costs credits.

    Try: “Add background music and a voiceover to this intro.”

    Write · media-use

  • Rebuild a Figma file as motion

    Pulls assets, brand tokens and components from a Figma file and turns storyboard frames into animation. Use it when you paste a figma.com link.

    Try: “Turn this Figma frame into a 6-second animation: <figma link>”

    Write · figma

  • Build a live deck instead of an MP4

    Makes a deck with fragment reveals, branching hotspots and presenter notes, served by hyperframes present. The output is a deck, not a video.

    Write · slideshow

  • Port Remotion, Motion Canvas or Lottie work

    Moves existing Remotion, Motion Canvas, Lottie, Three.js or similar video work into HyperFrames, checked frame by frame.

    Try: “Port my Remotion composition to HyperFrames.”

    Write · remotion-to-hyperframes

  • Used by the assistant behind the scenes

    Rebuild a video file as an editable project

    Rebuilds a video file as a HyperFrames project and compares the render with the original. Marked internal in the repo.

    Write · reverse-any-video

From the official docs

Permissions

Medium risk

The plugin has no hooks, but its skills make the agent install packages, run a local renderer and send usage data and feedback to HeyGen. Review commands as they come up and run npx hyperframes telemetry disable if you do not want that.

What it can do

  • Read your data
  • Create and change things
  • Delete things
  • Read-only mode

Watch out for

  • Agent sends feedback after renders

    The CLI skill tells the agent to run npx hyperframes feedback after each verified render, to a public channel, unless telemetry is off. Run npx hyperframes telemetry disable to stop it. github.com

  • Telemetry tied to HeyGen sign-in

    Usage counters are anonymous until you run auth login, then they are linked to your HeyGen email and username. Set HYPERFRAMES_NO_TELEMETRY=1 to turn them off. github.com

  • Older versions sent snapshot frames to Gemini

    Before a fix merged on 2026-10-26, npx hyperframes snapshot sent captured frames to Gemini whenever GEMINI_API_KEY or GOOGLE_API_KEY was set. Current versions keep frames local unless you pass --describe. Update if you are on an older version. github.com

  • Downloads Chrome, copies the whole repo

    The CLI downloads chrome-headless-shell to render. Claude Code also copies the full repo as the plugin source, and a harmless 'packages were not installed' warning may show. github.com

  • No hooks in this plugin

    The plugin ships skills only: no hooks, MCP servers, commands or agents, so nothing runs by itself on a Claude Code event. A PreToolUse hook in the repo's .claude/settings.json is for contributors and is not installed. github.com

  • Cloud and media use your HeyGen account

    Cloud render, publish and HeyGen media upload project files or call HeyGen with your login or API key. Generated media costs credits. github.com

  • Official marketplace copy is older

    The copy in Anthropic's claude-plugins-official is pinned to a 2026-09-22 commit. HeyGen's own marketplace follows releases. raw.githubusercontent.com

Security advisories

No published security advisories as of Nov 2, 2026.

Technical details
Turning on read-onlyThe skills have the agent write project files, install packages, start a local preview server and run the renderer. Review each command your agent asks to run.
Talks toHeyGen telemetry and feedback. HeyGen cloud render and media (only when signed in). Chrome download for rendering. Gemini (only when you pass --describe to snapshot with a Gemini key set)
Sign-in and keysOptional HeyGen sign-in stores credentials in ~/.hyperframes/credentials; HEYGEN_API_KEY or HYPERFRAMES_API_KEY also work.

What people say

Users like how fast an agent gets to a usable first cut. They say it still needs a few polish prompts.

What people like

  • A finished intro MP4 from one prompt plus two fix prompts, in under twelve minutes.
  • Apache 2.0 license is a reason some pick it over Remotion.

Common complaints

  • First drafts need polishing, with timing the usual fix.
  • Skills contradicted each other in places, reported in a user audit and mostly fixed.
  • Rendering on WSL2 was about 5x slower than native Windows in one report.

In their words

BlogMay 2026
“The first iteration looked about 80% right. The logo scale was a touch too aggressive (it felt bouncy when I wanted gravitas), and the gradient sweep was moving too fast. Two prompts later, both fixed.”
Engr Mejba AhmedHacker NewsOct 2026
“It needed a lot of polishing after that, but the start was the 80% I needed to make this feel possible.”
alin23GitHub issueApr 2026
“Where I'd be honest with you: HyperFrames isn't trying to replace a pro NLE like Premiere or Resolve.”
jrusso1020GitHub issueOct 2026
“When two loaded skills give opposite rules, the agent picks one arbitrarily or stops to ask.”
germainpokercrusher

Included in this plugin

7

Questions

How do I install HyperFrames in Claude Code?

Use the install box above: add HeyGen's marketplace, install the plugin, then start a new session. You also need Node.js 22+ and FFmpeg. Try it with a 5-second title card.

What does the HyperFrames plugin include?

Eight skills from the repo's skills folder: seven published ones (hyperframes, hyperframes-cli, hyperframes-registry, media-use, figma, slideshow, remotion-to-hyperframes) plus an internal reverse-any-video. No hooks, MCP servers, commands or agents. The roughly 450 registry blocks are catalog items you add with the CLI, not separate skills.

Which HyperFrames skill should I use first?

hyperframes. It carries the render rules and the work loop, and the others (CLI, registry, media-use) are pulled in as needed. figma, slideshow and remotion-to-hyperframes are for specific jobs.

Is HyperFrames safe to use?

It has no hooks and no published security advisories as of 2026-11-02, but it runs commands, downloads Chrome and sends usage data and feedback to HeyGen unless you disable telemetry. Review the permissions section above.

Do I need a HeyGen account or API key?

No, not to write and render videos locally. A free HeyGen sign-in adds voiceover, music and asset search. Avatars, generated clips and cloud rendering use HeyGen credits.

Does HyperFrames work in Codex, Cursor or the Claude app?

Codex and Cursor yes: Codex gets the core skills with npx hyperframes skills update, and Cursor imports the repo as a team marketplace or a local plugin folder. The plugin is for Claude Code; in the Claude app use HeyGen's separate hosted connector, which renders in your HeyGen account.

HyperFrames vs Remotion?

Both render with headless Chrome and FFmpeg. HyperFrames uses plain HTML with no build step under Apache 2.0, while Remotion uses React and a source-available license, with a more mature cloud renderer.

Should I install hyperframes or core-skills?

hyperframes. core-skills is the older four-skill plugin. HeyGen says to install hyperframes, check it, then uninstall core-skills.

Why is HyperFrames in the official marketplace older than HeyGen's?

Anthropic's claude-plugins-official pins it to a 2026-09-22 commit, while HeyGen's own marketplace follows each release (0.8.230 on 2026-11-02). Use HeyGen's marketplace for the newest skills.

Does rendering happen locally or in the cloud?

Locally by default: headless Chrome captures frames and FFmpeg encodes the MP4. Cloud render, AWS Lambda and Cloud Run are optional.

Information

updated Nov 2, 2026

Runs in
Claude Code
Repository
heygen-com/hyperframes

heygen-com/hyperframes

Sources

Docs, issue trackers and discussions this page is built from.

Show all 32
  1. HyperFrames hosted MCP guide · github.com
  2. HyperFrames plugin guide · github.com
  3. Anthropic official marketplace · github.com
  4. Core skills · github.com
  5. skills CLI (any agent) · github.com
  6. HyperFrames CLI by hand · github.com
  7. HyperFrames README · github.com
  8. HyperFrames skills folder · github.com
  9. claude-plugins-official marketplace.json · raw.githubusercontent.com
  10. Quickstart · github.com
  11. hyperframes SKILL.md · github.com
  12. hyperframes-cli SKILL.md · github.com
  13. hyperframes-registry SKILL.md · github.com
  14. media-use SKILL.md · github.com
  15. figma SKILL.md · github.com
  16. slideshow SKILL.md · github.com
  17. remotion-to-hyperframes SKILL.md · github.com
  18. reverse-any-video SKILL.md · github.com
  19. Repo .claude/settings.json · github.com
  20. hyperframes-cli: upgrade, info, telemetry · github.com
  21. hyperframes-cli: feedback · github.com
  22. hyperframes-cli: cloud · github.com
  23. Issue 6138: snapshot and Gemini · github.com
  24. Issue 6272: packages not installed warning · github.com
  25. fix(cli): make snapshot --describe opt-in (#6368) · github.com
  26. README: HyperFrames vs Remotion · github.com
  27. HyperFrames releases · github.com
  28. AI video creation with HyperFrames and Claude Code · mejba.me
  29. Hacker News comment · news.ycombinator.com
  30. Hyperframes vs Remotion · github.com
  31. Skills contradictions · github.com
  32. WSL2 render speed · github.com

Updated Nov 2, 2026.