Skills
Skill 16 of 22
About 450 ready-made HyperFrames blocks and components installed as editable source - transitions, overlays, titles, kinetic type, captions, charts, map overlays, 3D, camera moves.
2 minutes · 398 words · 5 sections
Install
npx skills add heygen-com/hyperframes --skill hyperframes-registrynpx skills add heygen-com/hyperframes/plugin marketplace add heygen-com/hyperframesThe first command installs just this skill, by the name in its SKILL.md; the second installs the whole repository.
Plugin installs: Inside a HyperFrames plugin, follow plugin execution rules (opens in a new tab).
Usage beacon: run npx hyperframes events --skill=hyperframes-registry once as this skill starts. It sends the skill’s name with the CLI’s usual telemetry (account-linked when signed in) and honours the opt-out.
Starting from an item is faster and usually better than writing the effect yourself, and an installed item is ordinary source in your project: change it, cut it down, restyle it.
There is no hyperframes registry command; searching is catalog, installing is add.
npx hyperframes catalog --query "<what the beat should do, in English>" --json
npx hyperframes add <name> --json # prints the written files and the mount snippetNo searchable words in query, which is not a gap.words tier only finds items that reuse your words; --on-device ranks by meaning after a one-time ~33 MB download. Offer that download and let the person decide; never enable it silently. The --json envelope names the tier that answered.--type block|component and --tag <tag>. add <tag> installs every block with that tag; dependencies install first. add needs the network even for an item installed before; search works offline from the cached manifest.catalog --query prints the line pre-filled (report_gap in --json): npx hyperframes feedback --search-miss "<query>" --wanted "<the move you needed>" --tier <tier>. Describe the effect, not an item name you imagined.Tiers, dropped and unindexed, stale indexes, offline behaviour: references/search.md.
| Blocks: a scene with its own timeline | Examples |
|---|---|
| Transitions | beat-freeze-cut, chromatic-radial-split, cinematic-zoom |
| Overlays and lower thirds | camcorder-hud, editorial-flash-overlay, lt-clean-bar |
| Title cards and kinetic type | canopy-part-title, code-slice-hero |
| Social, chat and UI cards | ai-chat-reveal, chatgpt-exchange |
| Code, charts, data and maps | code-diff, bar-chart-race, data-chart |
| 3D, shader and backgrounds | app-showcase, aurora, blob |
| Components: a snippet merged into your scene | Examples |
|---|---|
| Motion primitives and text effects | agent-cursor, blur-in, bottom-up-letters |
| Caption styles | caption-clip-wipe, caption-editorial-emphasis |
| Camera moves | camera-shake, camera-scan-gate |
| Product demo and UI props | before-after-wipe, browser-device-stage |
| Textures, particles and effects | ascii-render-pass, grain-overlay |
compositions/<name>.html. Mount it with data-composition-src, data-composition-id matching the block’s own id, data-start and the data-duration you need; the snippet add prints is the starting point. references/wiring-blocks.md.compositions/components/<name>.html. Copy its markup, <style> and script into your scene, and follow its comment block if it hooks into your timeline. references/wiring-components.md.data-variable-values on its host (add --vars '{"title":"…"}' writes that), and point its colour and font variables at your brand’s.npx hyperframes beats --json: the beat times minus the mount’s data-start.hyperframes.json (references/install-locations.md).Authoring a new block or component for an upstream PR: references/contributing.md, starter templates in references/templates.md, quality bar in references/component-quality-bar.md.
About 450 ready-made HyperFrames blocks and components installed as editable source - transitions, overlays, titles, kinetic type, captions, charts, map overlays, 3D, camera moves. Use it before hand-building any named visual (CRT scanlines, glitch, film grain, a chart); also for hyperframes add and catalog.
The verbatim description from this skill’s front matter — the string an agent matches on to decide whether to load it.
main, last pushed 8 November 2026.SKILL.md, not by matching a directory convention. 3 distinct layouts observed: .agents/skills/*/SKILL.md, registry/blocks/*/SKILL.md, skills/*/SKILL.md.h1 and no skipped levels:.claude-plugin/marketplace.json by HeyGen, declaring 2 plugins. It is read for editorial metadata only — never as the skill index, which is always the repository tree./heygen-com/hyperframes.md, and each skill at its own .md URL.12 files · 79 KB
Everything this skill ships beside its prose. All of it is set here, as subchapters of skill 16.
Documentation the agent loads on demand, rather than up front.
Everything else published alongside the skill.