How to install a skill in Claude Code, Codex or Cursor

A skill is a folder with a SKILL.md file (instructions for the agent) plus templates and scripts. Install it once, and your agent uses it whenever a request matches.

The fastest way: ask your agent

Copy the install prompt from any skill page and paste it into your agent:

Read https://claude-motion.com/skills/<slug>/install.md and follow the instructions to install the "<slug>" skill, then run it once with its example prompt.

The agent reads the guide, asks you to download the archive in your browser, unzips it into the right folder and runs a first render.

Manual install

1. Download the ZIP from the skill page.
2. Unzip it so the folder keeps its name (<slug>/SKILL.md):
   • Claude Code: ~/.claude/skills/<slug>/, or .claude/skills/<slug>/ inside a project
   • Codex: ~/.agents/skills/<slug>/
   • Cursor: .cursor/skills/<slug>/ inside the project
   • Gemini CLI: ~/.gemini/skills/<slug>/
3. Start a new agent session so it picks up the skill.

mkdir -p ~/.claude/skills
unzip -o ~/Downloads/kinetic-type-title.zip -d ~/.claude/skills/

What you need on your machine

• Node.js 22 or newer
• FFmpeg (brew install ffmpeg on macOS)
• Google Chrome (the renderer drives it headlessly)

The HyperFrames CLI installs itself through npx the first time a skill renders.

Using a skill

Just ask: "Make a 9:16 title card that says Ship faster, sleep better." The agent copies the template, writes a brief.json, runs hyperframes check, looks at snapshot frames to catch layout problems, then renders the MP4 and tells you where it is.