Video AI

7 Best Claude Skills for Motion Graphics and Animation in 2026

TL;DR

Remotion and HyperFrames are the two skills that take Claude Code from a prompt to a rendered MP4 with animated text and charts. Manim fits math and algorithm explainers, GSAP drives the animation inside a browser page, and FFmpeg only finishes and exports the result. Every one of them still leaves you reviewing code.

The best Claude skills for motion graphics turn Claude Code from a general coder into one that knows Remotion’s timing rules, Manim’s scene classes or GSAP’s timelines. This list compares seven public skills on install, render output, text and chart animation, and how much code you still touch.

We compared them by reading each repo and docs page in November 2026, not by running them. Stars are the counts GitHub showed on each page then.

What a Claude skill does for motion graphics

A skill is a folder with a SKILL.md that Claude Code loads when your request matches it. According to the Claude Code skills docs, personal skills live in ~/.claude/skills/<name>/SKILL.md and project skills in .claude/skills/<name>/SKILL.md.

For motion graphics, the skill doesn’t draw anything. It teaches Claude one library’s rules, so the code it writes runs the first time more often.

You also need two kinds of parts. An animation library describes motion, and a renderer turns it into frames and an MP4.

Official skill or community skill

This distinction matters, so here it is up front. An official skill is published by the people who make the tool.

Quick picks

Want Use
Animated text, charts and captions in a real MP4 Remotion or HyperFrames
Math, algorithm or equation explainers Manim skills
Fine control of motion inside a web page GSAP skills
Trim, caption, export and polish a finished render FFmpeg skill
Short looping GIFs Slack GIF Creator
Generative p5.js art Algorithmic art

1. Remotion agent skills

Remotion agent skills docs page — best Claude skills for motion graphics Remotion’s Agent Skills page lists 13 skills, from project creation to rendering.

Remotion makes video with React, and its own team maintains the skills. The remotion-dev/skills repo showed 6.6k stars, and the main Remotion repo 71.6k.

Install with npx skills add remotion-dev/skills, or gh skill install remotion-dev/skills. The docs say bun create video offers to add them too.

The set covers /remotion-markup for layout, animation, typography and timing, plus /remotion-render, /remotion-captions, /remotion-maps and a catch-all /remotion-best-practices. That breadth makes it the most complete answer for text, charts and map animation.

You still read React code, run Studio and fix what breaks. The Remotion license is free for individuals, non-profits and for-profit teams of up to 3 people, and needs a company license above that.

Pros

Cons

Best for: Developers who want programmatic video with typographic control.

Pricing: Skills are free to install. Remotion licensing as above.


2. HyperFrames skills

HyperFrames GitHub repo — HeyGen’s HTML to video skills for Claude Code motion graphics HyperFrames on GitHub: 80.8k stars and a Claude Code plugin manifest.

HyperFrames is HeyGen’s open-source framework for writing HTML and rendering it to video. The repo showed 80.8k stars, an Apache-2.0 license and release v0.9.23 on the day we read it.

For Claude Code, run claude plugin marketplace add heygen-com/hyperframes and then claude plugin install hyperframes@hyperframes. The README then points you to /hyperframes:hyperframes, and npx skills add heygen-com/hyperframes works for standalone skills.

It lists nine skills, including /hyperframes, /hyperframes-cli, /hyperframes-registry and /remotion-to-hyperframes. The README says each frame is seeked in headless Chrome and encoded with FFmpeg, and it names GSAP, CSS, Lottie, Three.js and Anime.js as animation options.

It needs Node.js 22 or newer and FFmpeg. You write HTML and timelines instead of React, so web animators will feel at home.

Pros

Cons

Best for: Web developers who prefer HTML and GSAP over React.

Pricing: Open source. The README says Studio is free, with a Pro plan for HeyGen’s premium models.


3. Manim skills

Manim skills repository on GitHub — Claude skills for 3Blue1Brown style animation adithya-s-k/manim_skill: two skills, one per Manim version.

manim_skill is a community repo by adithya-s-k, with 1.3k stars and an MIT license. Its README does not claim affiliation with the Manim projects, and the last commit was about 10 months before we read it.

Install the Community Edition skill with npx skills add adithya-s-k/manim_skill/skills/manimce-best-practices. A second skill, manimgl-best-practices, covers 3Blue1Brown’s ManimGL.

The README warns that the two Manim versions are incompatible: from manim import * versus from manimlib import *, and Create() versus ShowCreation(). The skill’s main job is stopping Claude mixing them up.

Manim is the right pick for equations, graphs and algorithm visuals. It needs Python, FFmpeg and a full LaTeX distribution, and render quality is a flag such as -qh.

Pros

Cons

Best for: Educators and engineers explaining math or algorithms.

Pricing: Free.


4. GSAP skills

GSAP skills GitHub repository — official GreenSock skills for Claude Code animation greensock/gsap-skills describes itself as the official AI skills for GSAP.

gsap-skills is published by GreenSock, the makers of GSAP, and its About text calls it official. It showed 18.1k stars and an MIT license, with the last commit about 7 months old.

In Claude Code, run /plugin marketplace add greensock/gsap-skills, then install from /plugin. npx skills add https://github.com/greensock/gsap-skills is the cross-agent route.

It has eight skills, including gsap-core, gsap-timeline, gsap-plugins for SplitText and MorphSVG, and gsap-react. Timelines and text splitting are the heart of kinetic typography.

GSAP animates a web page and does not render video. To get an MP4 you pair it with a renderer, and HyperFrames lists GSAP as a supported animation option.

Pros

Cons

Best for: Front-end developers who want precise web motion, or a GSAP layer inside a video framework.

Pricing: Free.


5. FFmpeg skill

FFmpeg skill GitHub repo — local video editing skill for Claude Code kajisho5/ffmpeg-skill: 42 FFmpeg tools for coding agents.

FFmpeg alone is not a motion graphics tool. It cuts, joins, encodes and overlays video, and that is what the FFmpeg skill from the community developer kajisho5 wraps.

The repo showed 4.8k stars, MIT, and release 3.2.3 the day before we read it. Install with npx ffmpeg-skill, and it needs FFmpeg 6.1 or newer and Python 3.10 or newer.

The README says its graphics.py draws lower-thirds, title cards, progress bars and countdowns, and caption.py supports animated pop captions and word-by-word karaoke highlights. Those are simple, template-style graphics, not choreographed scenes.

The README also says the repo does not call Remotion. Use this skill to trim, reframe, caption and export what Remotion or HyperFrames renders.

Pros

Cons

Best for: Polishing and exporting a render.

Pricing: Free.


6. Slack GIF Creator

Slack GIF Creator skill in Anthropic’s skills repo — Claude skill for animated GIFs Anthropic’s slack-gif-creator folder, part of the 189k-star skills repo.

Slack GIF Creator is one of Anthropic’s own example skills. The parent anthropics/skills repo showed 189.1k stars.

It teaches Claude to draw GIFs with Pillow. Per the SKILL.md, it recommends 128x128 for emoji GIFs, 480x480 for message GIFs, 10 to 30 fps, and gives easing functions and patterns like bounce, pulse and burst.

Install through the plugin marketplace with /plugin marketplace add anthropics/skills. We couldn’t confirm which bundle holds this skill, so copying its folder into ~/.claude/skills/ is the safe route.

This is small-scale animation. You get tiny loops, not explainer videos.

Pros

Cons

Best for: Reaction GIFs and short UI loops.

Pricing: Free.


7. Algorithmic art

Algorithmic art skill in Anthropic’s skills repo — p5.js generative visuals for Claude Anthropic’s algorithmic-art skill builds a single HTML page with p5.js.

Algorithmic art is another Anthropic example skill. It writes a short philosophy document and then a self-contained HTML page using p5.js.

The SKILL.md allows static or animated pieces, with seed controls and a Download PNG button. It mentions no video export, so treat it as generative motion for the browser, such as backgrounds, not as a video tool.

It earns the last spot because it is an official skill that animates, and nothing else on this list does generative art. It is the weakest fit for business explainers.

Pros

Cons

Best for: Generative backgrounds and experiments.

Pricing: Free.


Comparison table

Skill Maintained by Type Renders video Install
Remotion Remotion Official Yes (React) npx skills add remotion-dev/skills
HyperFrames HeyGen Official Yes (HTML) claude plugin marketplace add heygen-com/hyperframes
Manim adithya-s-k Community Yes (Python) npx skills add adithya-s-k/manim_skill/skills/manimce-best-practices
GSAP GreenSock Official No, browser only /plugin marketplace add greensock/gsap-skills
FFmpeg kajisho5 Community Edits and encodes npx ffmpeg-skill
Slack GIF Creator Anthropic Official GIF only Copy folder to ~/.claude/skills/
Algorithmic art Anthropic Official No, PNG export Copy folder to ~/.claude/skills/

If you’d rather not touch a terminal

Every skill above ends the same way: you install tools, read code and debug renders. Vidwip has no Claude skill, no MCP server and no plugin, so it isn’t part of the ranking.

It is a different route to the same output. AI Motion Graphics turns a written brief into an animated explainer, and each scene is drawn with code, so text stays sharp and charts stay neat.

You pick from 85 styles, and videos run 30 seconds to 5 minutes at 1080p. Add an AI song or a voiceover in 74 languages, with nothing to install.

The limits are real. There is no scene editor, you can’t upload a logo or brand fonts, and it makes 2D animation.

The default animator costs 8 credits per second, or $0.08, and the cheapest option 6 per pricing. Sign up free.

For code-first workflows, read Claude Code motion graphics skills. For the wider video picture, see Claude skills for video creation and video editing skills for Claude.

How to choose the best Claude skills for motion graphics

A final point on cost. The skills are free, but your time debugging renders is not, so count it.

What is a Claude skill?
A Claude skill is a folder with a SKILL.md file that Claude Code loads when a task matches its description. Per the Claude Code docs, personal skills live in ~/.claude/skills/<name>/SKILL.md and project skills in .claude/skills/<name>/SKILL.md. Plugins can bundle skills too.
Which Claude skill is best for motion graphics?
Remotion's agent skills and HeyGen's HyperFrames skills are the two that go all the way to a rendered video with animated text, charts and transitions. Remotion is React and has a company license for larger for-profit teams. HyperFrames is HTML and Apache-2.0 licensed.
Can Claude Code make motion graphics without a skill?
Yes, because Claude can write animation code on its own. A skill adds the library's conventions, such as Remotion's timing rules or Manim's version differences, so Claude makes fewer wrong API calls. You still need the animation library and a renderer installed.
Is FFmpeg a motion graphics tool?
Not on its own. FFmpeg cuts, joins, encodes and overlays video. The community FFmpeg skill adds lower-thirds, title cards and animated captions, but anything with real choreography is better built in Remotion or HyperFrames and then exported through FFmpeg.
Do these skills work without writing code?
No. Claude writes the code, but you still run installs, preview renders and fix errors. If you want a finished animated explainer from a written brief with nothing to install, a hosted tool such as Vidwip AI Motion Graphics covers that job.
Are these skills free?
The skills are open source or free to install. Remotion needs a company license for for-profit organizations with more than 3 employees, per its license page. Claude Code itself needs a Claude plan or API access, which is separate.

Animate an explainer from a written brief

Vidwip AI Motion Graphics draws every scene with code from your brief, in 85 styles, 30 seconds to 5 minutes at 1080p. Sign up free.