AI CSS Animations

HyperFrames Motion Graphics

HeyGen's HTML-to-video engine built for agents. Its motion-graphics skill makes short, unnarrated pieces: kinetic type, stat count-ups, charts, logo stings, lower thirds, maps, tweet and webpage animations.

By HeyGen @heygen-com Mar 10, 2026

Type
skill
Made with
Claude Code
Built in
HyperFrames
Topics
Kinetic type · Charts · Logo reveal · Maps

The skill

> **The front door is `/hyperframes`.** This skill makes a **short, design-led, unnarrated motion graphic** (motion is the message; ~under 10s, no voice-over). Anything longer, narrated, or multi-scene — or any uncertainty → read `/hyperframes` first: the intent layer owns every route decision.

[…]

A short design-led motion graphic. **Asset-first**: decide the asset strategy and source real material _before_ designing the shot, then design the shot around what you have, then compose by reusing catalog capabilities. All artifacts go to `PROJECT_DIR = videos/<project-name>/` (created in Step 0); all paths below are relative to it.

From HeyGen's repo, under the Apache-2.0 license.

Similar prompts