Skip to content

Code skill · free

Kinetic Type Title

Turn a line of text into an animated title clip. Renders locally, no API cost.

A six-second title this skill rendered from the line "Ideas that move". Each word enters with its own move, "move" lands on an accent block, an accent bar wipes in, then the words exit.

Download the skill

Install it in Claude Code, Codex, Cursor and run it on your own computer.

Download .zip

Get it on GitHub

The open-source version, free to use and change.

Open on GitHub

Install

  1. Download the .zip above and unzip it.
  2. Put the kinetic-type-title folder in your agent's skills folder, for example ~/.claude/skills/kinetic-type-title for Claude Code.
  3. Ask your agent for the video. The skill's SKILL.md tells it what to collect and which script to run.

Inputs

  • Title text (text)

    One to eight words, 60 characters at most. Each word gets its own entrance.

  • Highlighted word (text, optional)

    The word that sits on the accent-colour block. The last word if you don't pick one.

  • Colours (text, optional)

    Hex colours for the accent, the background and the text, such as

  • Length in seconds (number, optional)

    3 to 12 seconds. Short titles read best at 4 to 8.

  • Format (choice, optional)

    Landscape 1920x1080, portrait 1080x1920 for Shorts and Reels, or square 1080x1080.

Made with

Engine
HyperFrames
Output
video
Cost per run
Free: renders on your computer

Kinetic typography is text that moves: words slide, scale and snap in time so a short message holds attention. It is the classic opener for launch videos, YouTube intros and social posts.

This skill gives your coding agent a tested recipe for that kind of title. You tell the agent the words, which word to highlight and a length. The agent writes the animation, and HyperFrames renders it to an MP4 on your machine.

What the clip looks like

  1. The words enter one after another, each with a different move: rising, sliding, zooming out of a blur, dropping in.
  2. One word lands on a block in your accent colour, and an accent bar wipes in under the line.
  3. The title holds with a slow push-in, then the words leave upward, ready to cut to your next shot.

How it works

  1. Download the skill and put it in your agent’s skills folder (the steps are above).
  2. Ask, for example: “Make a 6-second kinetic title that says Ideas that move, highlight move, in purple.”
  3. The agent checks a few still frames, then renders an MP4 you can drop into any editor.

Why a code video skill

Because the video is code, every frame is exact and repeatable. Change one word and render again; the timing and the brand colours stay the same. Nothing is sent to an AI video model, so a render costs nothing but your own computer time.

Questions

Does this skill cost anything to run?
No. It is a code video skill, so your agent writes HTML and HyperFrames renders it on your own computer. There is no AI model call and no API cost.
What do I need installed?
Node.js 22 or newer and FFmpeg, plus a coding agent such as Claude Code, Codex or Cursor. HyperFrames downloads its own headless Chrome the first time it renders.
How long does a render take?
Our six-second 1080p sample rendered in about 13 seconds on a 4-core computer.
Can I use the videos commercially?
Yes. HyperFrames is open source under the Apache 2.0 licence, the skill is MIT, and the videos you render are yours.

Sources