Agent Skills Hub

About

What are agent skills?

Agent skills package instructions, scripts, and reference material into a single folder (SKILL.md) so an AI agent can perform a specific task better. Claude, ChatGPT/Codex, Cursor, Gemini CLI, and GitHub Copilot all support the same format.

About this site

We collect skills from across the web and show which agents they work with and how to install them. Each skill belongs to its original author, and we always link to the source.

한국어

Category: Video & Media

HyperFrames Video Composition

HeyGen's skill for building videos as HTML with GSAP animations, captions, narration, and scene transitions.

Works with

What it does

  • Builds scenes and timing with HTML and data-* attributes
  • Adds audio-synced captions, TTS narration, and beat-reactive animation
  • Applies scene transitions such as crossfades, wipes, and shaders
  • Renders many videos from one template by swapping variables

When to use it

Great for product launch videos, explainers, and short-form social clips you want to produce repeatedly from code. Rendering requires Node.js 22+ and FFmpeg.

How to install

  1. Run the command below in your terminal. Pick the agents you use (Claude Code, Codex, Cursor, Gemini CLI, Copilot, and more) and it installs into the right folder.
npx skills add https://github.com/heygen-com/hyperframes --skill hyperframes
  1. To install manually, download the hyperframes skill folder from the GitHub repository and copy it into your agent's skills folder, such as ~/.claude/skills/ or .cursor/skills/.
  2. Ask your agent for a related task and the skill is used automatically.
View source ↗

Related skills