hyperframes
heygen-com · Apache-2.0 · 60,170 starsWrite HTML, render video. A seekable timeline, deterministic frames and a studio for editing. The engine MotionKit builds on.
Directory · checked 10 October 2026
Open-source motion skills for Claude Code and Codex
You do not need to pay anyone to make video with a coding agent. These are the open-source projects worth knowing, what each is good at, and the licence it ships under.
These are independent projects by their own authors. MotionKit is not affiliated with any of them and does not include their code. We link to them because they are good. Star counts and licences are as shown on GitHub on 10 October 2026; check the repository before relying on either.
Engines
The renderers that turn code into video. Most skills below sit on top of one of these.
remotion
remotion-dev · Remotion License · 63,004 starsMake videos with React components. Its own licence: free for individuals and small teams, paid for larger companies, so read the terms before commercial use.
Editorial and explainer looks
Paper textures, cut-outs and documentary pacing.
vox-explainer-skill
CK42BB · MIT · 110 starsA Claude Code skill that takes one topic and produces an editorial-style explainer: script, keyframes, animation, voiceover and music.
vox-style-animation
Cele-san · MIT · 2 starsAn editorial motion-graphics look packaged as a HyperFrames style pack, with a method for capturing a style into your own pack.
Leslie-vox-style.skill
Ai-Leslie · MIT · 0 starsCodex skills for documentary storytelling, editorial collage and explainer-style motion graphics.
motion-skill
LunaAI519 · MIT · 0 starsTurns one reference image into a retro scrapbook-style short, using image and video models for the frames. Includes a copyright self-check. Docs in Chinese.
Hand-drawn and character animation
When a diagram should look sketched, or a character should act.
ClaudeAnimationBase
JohnHeibel · MIT · 1,000 starsA starter kit for hand-painted cartoon animation with p5.js: a character with 31 acted emotions and a guide for the model.
HandDraw-Skill
ToBeWin · MIT · 3 starsA deterministic hand-drawn video engine built on SVG, Remotion and FFmpeg: whiteboard explanations drawn stroke by stroke.
Product and launch videos
Shot recipes, storyboards and promo formats.
video-shotcraft
Vincentwei1021 · Apache-2.0 · 11,138 starsCinematic product videos with Remotion for Claude Code and Codex: a large library of shot recipe cards and motion previews.
make-awesome-video
NewTurn2017 · MIT · 4 starsA directing workflow for launch videos: analyse references, write three storyboards, make stills, render, then give director notes.
brewreel
Finderchangchang · Apache-2.0 · 161 starsPortrait promo videos from a product brief, designed to work with low-cost models. Recipes by industry and an advertising-law check. Docs in Chinese.
html-animation
acelera-agency · MIT · 9 starsFrame-exact animated logos, kinetic typography and brand videos as a single HTML file, then exported to video.
Principles and building blocks
Not a look, but the knowledge that makes any look move well.
motion-design-skill
LottieFiles · MIT · 2,075 starsMotion design principles written for AI agents: timing, easing, choreography and the classic animation principles adapted for interfaces.
skills
VideoZero · Apache-2.0 · 73 starsA collection of skills for structured, diagram-style video generation based on Motion Canvas.
How to choose
- Want a specific look? Start with a style skill from the editorial or hand-drawn groups.
- Want to understand the craft? Read the motion design principles skill first. It improves everything else.
- Building your own? Pick an engine. HyperFrames is plain HTML and Apache-2.0; Remotion is React with its own licence.
Where MotionKit fits
MotionKit is a paid pack on top of HyperFrames. What you pay for is the part open source does not give you for free: 16 finished styles with a complete example each, interactive decks and PowerPoint from the same content, voiceover credits and hosted share links. If the free projects above cover what you need, use them.
Know a project that belongs here? Email support@motionforclaude.com.
Make your first motion video tonight
One command, then hand your agent a document.