heygen-com avatar

Hyperframes Core

The composition contract for turning HTML into video. This is the technical reference you read before writing a HyperFrames project: how `data-*` timing attributes work, how to wire sub-compositions, what the deterministic render rules ban (no `Math.random`, no animating `display`, media must be direct children), and why your full-screen background might render black even though preview looks fine. The skill separates structure from animation (that lives in `hyperframes-animation`) and creative direction (in `hyperframes-creative`). If you're building or editing a composition, start here for the rules that `lint` won't catch, then jump to the reference that matches your immediate problem.

install copies · 90 days. Times the install command was copied on this site in the last 90 days, bots filtered.
19
skills.sh installs
931.1K
GitHub stars
81.8K
last updated
Aug 21, 2026

Install

$ npx -y skills add heygen-com/hyperframes --skill hyperframes-core --agent claude-code

Installs into .claude/skills of the current project.

Files

The composition contract for turning HTML into video. This is the technical reference you read before writing a HyperFrames project: how `data-*` timing attributes work, how to wire sub-compositions, what the deterministic render rules ban (no `Math.random`, no animating `display`, media must be direct children), and why your full-screen background might render black even though preview looks fine. The skill separates structure from animation (that lives in `hyperframes-animation`) and creative direction (in `hyperframes-creative`). If you're building or editing a composition, start here for the rules that `lint` won't catch, then jump to the reference that matches your immediate problem.

Browse the repository on GitHub

Sponsors

Details

Repository
github.com/heygen-com/hyperframes
Categories
Frontend Development, DevOps & CI/CD, Documentation, Productivity & Planning, Automation & Workflows
First seen
Jul 14, 2026

More from heygen-com/hyperframes

All 44
1heygen-com avatarremotion-to-hyperframesheygen-com/hyperframesPort an existing Remotion (React) composition's source to HyperFrames HTML. Use ONLY on an explicit ask to port/convert/migrate/translate a Remotion source — on590.2Kskills.sh installs
2prisma avatarprisma-computeprisma/skillsPrisma Compute deployment and hosting guide. Use whenever the user mentions Prisma Compute, `prisma.compute.ts`, `defineComputeConfig`, deploying or hosting a P399.3Kskills.sh installs
3pbakaus avatarimpeccablepbakaus/impeccableUse when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise396.9Kskills.sh installs
4supabase avatarsupabasesupabase/agent-skillsUse when doing ANY task involving Supabase. Triggers: Supabase products (Database, Auth, Edge Functions, Realtime, Storage, Vectors, Cron, Queues); client libra361.1Kskills.sh installs
5firebase avatarfirebase-hosting-basicsfirebase/agent-skillsDeploys and configures classic Firebase Hosting for static websites, single-page apps (SPAs), and microservices. Use when deploying static sites/SPAs, setting u177.5Kskills.sh installs
6firebase avatarfirebase-app-hosting-basicsfirebase/agent-skillsDeploys and manages full-stack web applications (Next.js, Angular) with Server-Side Rendering (SSR) using Firebase App Hosting. Use when deploying Next.js/Angul176.9Kskills.sh installs