Motion Design Skills plugin
Nine motion design skills for Claude Code: timing, color, composition, After Effects, Remotion, logos and backgrounds.
- 229 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skills give instructions and examples, and the `.jsx` scripts are run by you inside After Effects.
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add plugins/motion-design-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skills give instructions and examples, and the `.jsx` scripts are run by you inside After Effects.
This is third-party code. Review the repository files before installing.
What it does
The plugin packs motion design basics into installable skills. `animation-principles` covers timing, easing and the 12 principles of animation. `color-motion` handles palettes, gradients, OKLCH and Lab interpolation and render color. `shot-composition` covers grids, safe areas and framing. `motion-art-direction` sets motion language, tone and pacing. Tool skills: `after-effects` with expressions, rigging, export recipes and `.jsx` scripts, `beat-sync-editing` for cutting to the beat, and `remotion-video` for programmatic React video rendered to MP4 and GIF. For interfaces and brands there are `logo-animation` (stingers, loaders) and `motion-background` (mesh gradients, shader auroras, particles). The skills activate when you ask to fix how something moves (stiff, floaty, robotic), animate text, a logo or a background, build a Remotion video or work in After Effects. They install with `npx skills add iart-ai/motion-design-skills`.
Who it is for. Motion designers and frontend developers who animate interfaces, logos and videos through Claude Code, Cursor or Codex.
Good fit when
- An interface animation feels stiff and needs a timing and easing review.
- A landing page gets a shader background animation or a mesh gradient.
- A logo gets a stinger and loader for web and video.
- A Remotion video is cut to the beat of a track.
Not a fit when
- You need a finished video without working with code: the skills give knowledge to the agent and do not replace an editor.
- The project uses another animation engine with no After Effects or Remotion.
- The agent cannot read skills in SKILL.md format.
Example request
The card animation looks robotic: review the timing and easing and suggest curves for entry and exit.Limitations
The skills give the agent knowledge and scripts, and the video itself is built by Remotion or After Effects, so those programs and their environment are needed. The `.jsx` scripts run inside After Effects and change the project. The README says the full agent runs on iart.ai, and the skills suit Claude Code, Cursor, Codex and other agents. The install through `npx skills` downloads the package from the repository. The license is MIT, the last commit dates from November 2026.
How to disable. Run `/plugin uninstall motion-design-skills` or delete the skill directories from `~/.claude/skills/`, then restart the agent.
FAQ
How do I install the skills?
With `npx skills add iart-ai/motion-design-skills` or as a plugin: `/plugin marketplace add iart-ai/motion-design-skills`, then `/plugin install motion-design-skills`.
Which agents fit?
Claude Code, Cursor, Codex and 40+ other agents that read SKILL.md.
What is in the set?
Nine skills: animation-principles, color-motion, shot-composition, motion-art-direction, after-effects, beat-sync-editing, remotion-video, logo-animation, motion-background.
When do the skills activate?
When you ask to fix how something moves, animate text, a logo or a background, build a Remotion video or work in After Effects.
Is After Effects required?
Only for the `after-effects` skill, which holds expressions and `.jsx` scripts. The others work without it.
Discussion
No questions or reviews yet.
Related
PluginsFifteen Claude Code skills for launch films, animated charts and reels made entirely from code, with no After Effects
A motion design toolkit for coding agents: rules with numbers, frame self-review and synthesized sound, plus web sims at 60 fps
Seventeen skills for motion graphics: an agent builds looping 3D scenes, titles and clips with Remotion, Three.js and Python.
A skill that makes DeepSeek and other models build a Remotion film from a prompt close to Opus 5.5, with plan, sound and review
Motion Skills for AI agents
motion-skills
Over 50 open skills for motion graphics, animation and video: kinetic typography, charts, explainers, TikTok and Reels, WebGL, Manim
A skill that makes promo videos from code: direction, in-browser animation with motion blur, its own score and a 60 fps MP4
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| Motion Design Skills (this card) | no | 229 | |
| Motion Design Skill | no | 2,980 | Motion Design Skill stays a single skill, while here nine skills add After Effects, Remotion, logos and backgrounds. |
| Claude Remotion Skill | no | 984 | claude-remotion-skill focuses on Remotion, while this set adds motion principles, color and composition. |
README in short
A plugin of nine animation skills: principles, color, composition, After Effects, Remotion, logos and backgrounds. Installs through npx skills or /plugin.