This teaches Claude how to wire Anime.js animations into HyperFrames so they run on the composition timeline instead of wall-clock time. The key pattern is setting autoplay false, registering instances on window.__hfAnime, and letting HyperFrames drive playback with seek calls. You'd reach for this when you want Anime.js syntax for small DOM or SVG tweens but need them deterministic and render-safe. The skill covers both basic animations and timelines, warns you away from infinite loops and async construction, and points out that GSAP is still the default choice for anything complex. Useful if someone hands you an Anime.js snippet and you need to make it work inside a composition without rewriting it from scratch.

skills.sh installs
70K
GitHub stars
81.8K
last updated
Aug 21, 2026

Install

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

Installs into .claude/skills of the current project.

Files

This teaches Claude how to wire Anime.js animations into HyperFrames so they run on the composition timeline instead of wall-clock time. The key pattern is setting autoplay false, registering instances on window.__hfAnime, and letting HyperFrames drive playback with seek calls. You'd reach for this when you want Anime.js syntax for small DOM or SVG tweens but need them deterministic and render-safe. The skill covers both basic animations and timelines, warns you away from infinite loops and async construction, and points out that GSAP is still the default choice for anything complex. Useful if someone hands you an Anime.js snippet and you need to make it work inside a composition without rewriting it from scratch.

Browse the repository on GitHub

Sponsors

Details

Repository
github.com/heygen-com/hyperframes
Categories
Frontend Development, Documentation
First seen
May 16, 2026

More from heygen-com/hyperframes

All 44
1heygen-com avatarcontribute-catalogheygen-com/hyperframesAuthor a new HyperFrames registry block (caption style, VFX block, transition, lower third) or component (text effect, overlay, snippet) and ship it as an upstr55.5Kskills.sh installs
2jakubkrehel avatarbetter-uijakubkrehel/skillsDesign engineering principles for making interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover stat45.8Kskills.sh installs
3antfu avatarviteantfu/skillsVite build tool configuration, plugin API, SSR, and Vite 8 Rolldown migration. Use when working with Vite projects, vite.config.ts, Vite plugins, or building li41.7Kskills.sh installs
4jakubkrehel avatarbetter-typographyjakubkrehel/skillsWeb typography from choosing fonts to spacing, wrapping and accessibility. Use when picking or pairing typefaces, configuring variable fonts or OpenType feature40.5Kskills.sh installs
5pbakaus avatararrangepbakaus/impeccableImprove layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling o39.1Kskills.sh installs
6expo avatarexpo-uiexpo/skillsFramework (OSS). Build native UI with the @expo/ui package: real SwiftUI on iOS and Jetpack Compose on Android rendered from React in an Expo or React Native ap35.9Kskills.sh installs