Hyperframes
boraoztunc/skills
Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML.
Applies a house style for an animated, oversized pointer in launch videos that enters the frame, clicks to trigger the next beat, and exits.
$ npx skills add heygen-com/hyperframes --skill oversized-cursor -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install heygen-com/hyperframes oversized-cursor --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/heygen-com/hyperframes.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/oversized-cursor .claude/skills/oversized-cursor && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "oversized-cursor" agent skill from https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursor into .claude/skills/oversized-cursor/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "oversized-cursor", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursorType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add heygen-com/hyperframes --skill oversized-cursor -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install heygen-com/hyperframes oversized-cursor --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/heygen-com/hyperframes.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/oversized-cursor .agents/skills/oversized-cursor && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "oversized-cursor" agent skill from https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursor into .agents/skills/oversized-cursor/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "oversized-cursor", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add heygen-com/hyperframes --skill oversized-cursor -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install heygen-com/hyperframes oversized-cursor --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/heygen-com/hyperframes.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/oversized-cursor .cursor/skills/oversized-cursor && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "oversized-cursor" agent skill from https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursor into .cursor/skills/oversized-cursor/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "oversized-cursor", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/heygen-com/hyperframes.git --path .agents/skills/oversized-cursor--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add heygen-com/hyperframes --skill oversized-cursor -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install heygen-com/hyperframes oversized-cursor --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/heygen-com/hyperframes.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/oversized-cursor .gemini/skills/oversized-cursor && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "oversized-cursor" agent skill from https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursor into .gemini/skills/oversized-cursor/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "oversized-cursor", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install heygen-com/hyperframes oversized-cursorInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add heygen-com/hyperframes --skill oversized-cursor -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/heygen-com/hyperframes.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/oversized-cursor .github/skills/oversized-cursor && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "oversized-cursor" agent skill from https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursor into .github/skills/oversized-cursor/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "oversized-cursor", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add heygen-com/hyperframes --skill oversized-cursor -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install heygen-com/hyperframes oversized-cursor --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/heygen-com/hyperframes.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/oversized-cursor .opencode/skills/oversized-cursor && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "oversized-cursor" agent skill from https://github.com/heygen-com/hyperframes/tree/main/.agents/skills/oversized-cursor into .opencode/skills/oversized-cursor/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "oversized-cursor", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
oversized-cursorApplies a house style for an animated, oversized pointer in launch videos that enters the frame, clicks to trigger the next beat, and exits.
This skill sets out a specific motion convention: a large macOS-style cursor acting as a visible character in a scene, always entering from off-screen in one decelerating glide rather than fading in at rest, moving the viewer's eye toward the next point of interest, and clicking to visually cause whatever happens next. It fixes a size range depending on whether the scene is full-frame or a smaller in-mock view, plus two approved color pairings for keeping contrast consistent.
It also covers when to swap the default arrow for a brand-specific cursor, such as a design tool's colored pointer with a name tag, reserving that swap for motifs people would actually recognize rather than using it as a novelty. The same entry, targeting, click, and exit rules apply either way, down to the specific layering and shadow properties used to keep the cursor visible above scene content.
2 steps, taken from the first numbered list in SKILL.md.
Read from SKILL.md and the folder at commit f6b3821. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
No scripts in the folder and no shell commands in SKILL.md (its code samples are javascript and css).
From the folder's file list and the shell code blocks in SKILL.md.
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Oversized Cursor Motion Technique loads about 1.6k tokens when it runs. Until then it costs about 144 tokens; SKILL.md has 705 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from heygen-com/hyperframes at commit f6b3821, republished under its Apache-2.0 licence (© heygen-com). 705 words, ~1,642 tokens.
.claude/skills/oversized-cursor/SKILL.md (or your agent's skills folder).A deliberately oversized macOS-style pointer that travels the frame as a visible protagonist: it enters from off-screen, walks the viewer's eye to the next point of interest, clicks to cause the next thing that happens, and leaves. Production-proven across multiple launch films.
Why it exists. Big cursor movement is one of the cheapest high-yield motion sources in a launch video: one element, transform-only tweens, and it (1) brings the eye across the screen on scenes that would otherwise read as dead, (2) gives causal ignition to morphs/transitions ("the click did that"), and (3) segments the eye out of a stale state when kicking off a new scene or a complex animation sequence. Bigger is better — an actual-size cursor disappears at video scale.
7cqw (≈134px at 1920). In-mock / small-frame variants:
4.6–5.5cqw. Never smaller.#1c1c1c) + white stroke (1.4px). Pick per scene contrast, keep it
constant per film.filter: drop-shadow(0 4px 6px rgba(0,0,0,.3)), pointer-events: none,
z-index above all scene content, will-change: transform.#root .cursor {
position: absolute;
left: 48%;
top: 115%; /* off-screen below — the resting pose IS off-screen */
width: 7cqw;
height: 7cqw;
z-index: 20;
filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.3));
pointer-events: none;
will-change: transform;
}The cursor always enters from off-screen (canonical: from below, top:115–120%)
and travels to its first target in one decelerating glide. It must feel like it
entered the room. Never opacity-fade it in at a resting position, never mask-reveal
it — that reads as a glitch (a real, repeatedly observed failure mode).
duration: 0.4–0.92s, ease: power3.out, immediateRender: false on the fromTo.tl.fromTo(
cursor,
{ left: "48.6%", top: "115%" },
{ left: "48.6%", top: "55%", duration: 0.85, ease: "power3.out", immediateRender: false },
0.25,
);The hot-spot is the arrow TIP, not the box center. Land the tip on the target's
center, and pivot all press scaling on the tip: transformOrigin: '21% 14%' (for the
house arrow path in a 24-unit viewBox).
Click = asymmetric compress/expand (1:2 ratio reads as a real tap):
tl.to(cursor, { scale: 0.84, duration: 0.1, ease: "power2.in", transformOrigin: "21% 14%" }, t);
tl.to(
cursor,
{ scale: 1, duration: 0.22, ease: "power2.out", transformOrigin: "21% 14%" },
t + 0.1,
);The target's reaction is a separate, parallel tween (button: scale: 0.94 + press
color/shadow, starting at the same t). Cursor-only taps (e.g. focusing a text input)
get NO target reaction. Pair with cursor-click-ripple / press-release-spring for
the target side.
Never let a morph, typing run, window transform, or scene-defining animation simply start. Park the cursor on the trigger and let the click cause it, same-frame:
During long beats it doesn't own (typing, narration), the cursor drifts aside
(0.5–0.9s, power2.out) — never sits frozen on top of the action, never wobbles idly.
Two sanctioned exits — both physical, never an opacity fade in place:
power2.in
(left:'118%', left:'-12%', or top:'116%'), 0.5–0.7s.power2.in) toward the NEXT scene's first click point, covering the
first ~1/3 of that path; the next composition gsap.sets the cursor at the
handoff pose and continues with power2.out at matched velocity. The cursor itself
becomes the carrier element that stitches the seam:// scene A, last 0.3s — start the journey:
tl.to(cursor, { left: "40.7%", top: "63.7%", duration: 0.3, ease: "power2.in" }, CUT - 0.3);
// scene B, t=0 — finish it at matched velocity:
gsap.set(cursorB, { left: "40.7%", top: "63.7%" });
tl.to(cursorB, { left: "22%", top: "45%", duration: 0.6, ease: "power2.out" }, 0);transformOrigin: '21% 14%'© heygen-com, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Just SKILL.md in .agents/skills/oversized-cursor of heygen-com/hyperframes.
Open the folder on GitHubat commit f6b3821
We found 2 copies of this SKILL.md (exact, near-identical or edited) in other folders, from 1 other GitHub owner. This page covers the copy in heygen-com/hyperframes, which our catalogue first saw on October 7, 2026.
Oversized Cursor Motion Technique next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Oversized Cursor Motion Technique this skillheygen-com/hyperframes | 58k | 1 repos | ~1.6k | Automated safety check: Pass | Apache-2.0 | |
| Hyperframesboraoztunc/skills | 393 | 9 repos | ~7.6k | Automated safety check: Pass | Apache-2.0 | |
| Hyperframes Creativechmonitor/chmonitor | 298 | 5 repos | ~1.3k | Automated safety check: Pass | GPL-3.0 | |
| After Effectsaedev-tools/adobe-agent-skills | 106 | 1 repos | ~5.2k | Automated safety check: Pass | Apache-2.0 | |
| Motion Showreelnateherkai/hyperframes-student-kit | 1.2k | — | ~2.8k | Automated safety check: Pass | Custom licence | |
| Make A Videonateherkai/hyperframes-student-kit | 1.2k | 1 repos | ~3.1k | Automated safety check: Pass | Custom licence |
boraoztunc/skills
Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML.
chmonitor/chmonitor
Non-animation creative direction for HyperFrames videos. An agent skill from chmonitor/chmonitor.
aedev-tools/adobe-agent-skills
Automate Adobe After Effects via ExtendScript. An agent skill from aedev-tools/adobe-agent-skills.
nateherkai/hyperframes-student-kit
Design and build a 10-30 second motion-design showreel or brand reel in the style of Nate's Opus 5.5 "CLAUDE / MOTION REEL": one brand motif transformed through labeled craft chapters, a persistent…
nateherkai/hyperframes-student-kit
Beginner-friendly end-to-end video creator for HyperFrames. An agent skill from nateherkai/hyperframes-student-kit.
Mr-funny/hbg-life-simulation
Create Chinese HBG “模拟人生 / 人生副本” narrative videos with a consistent comic IP, a rapid multi-life opening, continuous natural-speed narration, synchronized short captions, dense static manga…
heygen-com/hyperframes
Collects motion rules, scene blueprints, transitions and runtime adapters for HyperFrames video compositions, with GSAP as the default animation runtime.
heygen-com/hyperframes
Finds, generates and edits media for HyperFrames video projects: music, sound effects, images, icons, logos, voiceovers, captions and color grades.
heygen-com/hyperframes
Adds captions to a single-subject talking-head video without editing the footage, from plain subtitles to cinematic text placed behind the speaker.
heygen-com/hyperframes
Turns a weekly changelog markdown file into a branded HyperFrames video with voiceover, animated mock-UI scenes and captions, using fonts, background and scripts bundled in the skill.
heygen-com/hyperframes
Turns an article, notes or a topic brief into an explainer video whose visuals are invented per scene, built frame by frame in HyperFrames with no footage.
heygen-com/hyperframes
Imports Figma assets, brand tokens, components and motion into a HyperFrames video composition, using the Figma REST API with a connector or native export for shaders.
Categories
Applies a house style for an animated, oversized pointer in launch videos that enters the frame, clicks to trigger the next beat, and exits. This skill sets out a specific motion convention: a large macOS-style cursor acting as a visible character in a scene, always entering from off-screen in one decelerating glide rather than fading in at rest, moving the viewer's eye toward the next point of interest, and clicking to visually cause whatever happens next. It fixes a size range depending on whether the scene is full-frame or a smaller in-mock view, plus two approved color pairings for keeping contrast consistent.
Oversized Cursor Motion Technique fits situations like: adding a sense of motion to a launch-video scene that otherwise reads as static; giving a click a visible cause before a morph or transition in a video; choosing between a default cursor and a brand-specific pointer for a scene.
Run `npx skills add heygen-com/hyperframes --skill oversized-cursor -a claude-code`. Or copy the skill folder (.agents/skills/oversized-cursor in heygen-com/hyperframes) into .claude/skills/oversized-cursor in your project. Claude Code loads it when a task matches its description.
Run `npx skills add heygen-com/hyperframes --skill oversized-cursor -a codex`. Or copy the skill folder (.agents/skills/oversized-cursor in heygen-com/hyperframes) into .agents/skills/oversized-cursor in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add heygen-com/hyperframes --skill oversized-cursor -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/oversized-cursor, .gemini/skills/oversized-cursor, .github/skills/oversized-cursor and .opencode/skills/oversized-cursor in your project.
SKILL.md names no scripts, command-line tools or credentials: Oversized Cursor Motion Technique is instructions for the agent only.
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Oversized Cursor Motion Technique is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 1.6k tokens (SKILL.md is roughly 6.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
Skills that share tags, products or a category with Oversized Cursor Motion Technique: Hyperframes (boraoztunc/skills, 393 stars), Hyperframes Creative (chmonitor/chmonitor, 298 stars), After Effects (aedev-tools/adobe-agent-skills, 106 stars) and Motion Showreel (nateherkai/hyperframes-student-kit, 1.2k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
heygen-com (a GitHub organization) maintains it in heygen-com/hyperframes, which has 58,020 GitHub stars. The repository holds 32 skills in this directory. The repository was last updated on October 7, 2026.
Source: heygen-com/hyperframes on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.