topskills

hyperframes

Write HTML, render video. Agent-native, deterministic, no build step.

Score 0(?)VerifiedCodeby HeyGenSource
Verified for:

Install

$ npx skills add heygen-com/hyperframes --skill hyperframes

Twenty skills ship in the repo — add --all for the full set, or --skill for one (hyperframes-keyframes, embedded-captions, pr-to-video…).

Best for

Programmatic video an agent can iterate on — release clips, motion graphics, captioned explainers.

Not ideal for

Generative video from a text prompt; that is a model API, not a renderer.

About this skill

Use when generating video programmatically — write HTML and CSS, render deterministic MP4 through headless Chrome and FFmpeg, with skills for keyframes, animation, audio, embedded captions, talking-head recuts and turning a pull request into a video.

VideoRenderingFFmpeg

Score breakdown

Score breakdown

rubric 1.0
Install count
0/20
Provenance
12.8/15
GitHub stars
13.1/15
Recency
10/10
Compatibility
2/10
Documentation depth
8/10
Install ergonomics
10/10
License
5/5
Verification freshness
5/5

Composite 0–100 score derived from 9 verifiable signals. See the rubric →

Related skills

Official

p5.js algorithmic art with particle systems and procedural geometry.

p5.jsGenerativeArt
All surfaces
Low1 min
Official

Visual art from prose. PNG and PDF outputs that look intentionally designed.

CanvasPNGPDF
All surfaces
Low1 min

Ranked #1 in Video & Media

Publish the ranking in your README. The badge reads the live score, so it updates when the ranking does.

hyperframes — ranked #1 in Video & Media on Top Agent Skills
Markdown
[![hyperframes — ranked #1 in Video & Media on Top Agent Skills](https://top-agent-skills.com/badge/hyperframes.svg)](https://top-agent-skills.com/skill/hyperframes)
HTML
<a href="https://top-agent-skills.com/skill/hyperframes"><img src="https://top-agent-skills.com/badge/hyperframes.svg" alt="hyperframes — ranked #1 in Video & Media on Top Agent Skills"></a>

Skill FAQ

About hyperframes

What is the hyperframes skill?

Use when generating video programmatically — write HTML and CSS, render deterministic MP4 through headless Chrome and FFmpeg, with skills for keyframes, animation, audio, embedded captions, talking-head recuts and turning a pull request into a video.

Which agents does hyperframes work with?

Claude Code.

How do I install hyperframes?

Run `npx skills add heygen-com/hyperframes --skill hyperframes` for Claude Code. See the install panel for per-agent commands.

Is hyperframes free to use?

Yes — hyperframes is open source (Apache-2.0).

Who maintains hyperframes?

hyperframes is published by HeyGen and was last updated on 2026-08-26.

What is hyperframes best for?

Programmatic video an agent can iterate on — release clips, motion graphics, captioned explainers.