Motion skill
The /motion skill and an MCP server with current Motion docs: agents write React and Vue animations from fresh examples.
- 34,970 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skill only reads Motion docs; MCP queries go to Motion's server.
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/motionDetects 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 skill only reads Motion docs; MCP queries go to Motion's server.
This is third-party code. Review the repository files before installing.
What it does
The Motion library for JavaScript, React and Vue ships a kit for coding agents. The `npx motion-ai` command installs the free `/motion` skill and sets up Motion's MCP servers for Claude Code, Cursor, Amp, OpenCode, Gemini CLI and Copilot. A separate MCP server at `https://mcp.motion.dev` searches the documentation and example metadata and needs no account. An index of every docs page is published as `llms.txt`. Paid Motion+ adds example and Motion UI source, MotionScore performance audits and CSS spring generation.
Who it is for. Frontend developers on React, Vue and plain JavaScript who build animations with Claude Code, Cursor or Gemini CLI.
Good fit when
- The project already uses `motion` or `motion-v` and the agent mixes old and new APIs.
- A move from `framer-motion` to the current package should not require manual site searches.
- An agent picks an animation example for a task from more than a hundred ready ones.
- A team uses several agent editors and wants one documentation setup.
Not a fit when
- Animations are built with another library such as GSAP.
- The agent works offline while Motion's MCP server is hosted externally.
- Paid Motion+ examples are needed but there is no subscription.
Example request
Move this card animation from `framer-motion` to `motion`, checking the docs through `/motion`, and suggest a spring instead of a linear curve.Limitations
The skill and MCP server supply Motion documentation and examples only and do not design animations for a project. The paid part is described above and is not part of the skill. The skill source lives in a separate `motiondivision/ai-kit` repository while the main one holds the library, so check the `motion` package version in the project. MCP queries go to the external `mcp.motion.dev` server, so documentation search is unavailable offline.
How to disable. Remove the `/motion` skill from the agent's skills directory and delete the `mcp.motion.dev` entry from the client's MCP settings. The `motion` library itself can stay.
FAQ
What does `npx motion-ai` install?
The free `/motion` skill and Motion MCP server setup for Claude Code, Cursor, Amp, OpenCode, Gemini CLI and Copilot. Source is in `motiondivision/ai-kit`.
Does the MCP server need an account?
No. The `https://mcp.motion.dev` server is free and searches documentation and example metadata.
What does Motion+ add?
It is a paid add-on to the free skill; details are on motion.dev/plus.
Is there a docs index for other tools?
Yes, `motion.dev/llms.txt` lists the docs pages. Motion+ pages are labelled as paid, with their install and import.
Which libraries does the skill cover?
The README names Motion for JavaScript and React, and the `motion-v` package for Vue.
Discussion
No questions or reviews yet.
Related
SkillsMotion.dev Animations Skill
motion-dev-animations-skill
A Claude Code skill for Motion.dev, the successor of Framer Motion: 120 fps web animation, spring physics, scroll animation
Motion2Code includes a web-animation skill: the agent checks output against source frames and shows both versions side by side.
Six Framer Motion skills for React: motion components, variants, gestures, scroll, layout animations and AnimatePresence
A skill for Claude Code and Codex that turns AI video and frames into web animation driven by scroll, cursor, touch or device tilt
Motion Web
motion-web
Sites with motion first on pure Three.js, Canvas 2D, WebGL and CSS: damping physics, tokens, 7 examples. CC BY-NC 4.0 license
Skill and MCP server for Shaders: the agent builds backgrounds, glass, gradients and cursor effects on WebGPU for React, Vue, Svelte, Solid and JS
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| Motion (this card) | no | 34,970 | |
| Framer Motion AI Skills | no | 10 | a third-party `framer-motion` skill set; this one is Motion's own skill and MCP server |
| Motion.dev Animations Skill | no | 224 | a standalone animation skill; this adds `npx motion-ai` with documentation search over MCP |
README in short
The README section on using Motion with AI lists three routes: the skill via `npx motion-ai`, a free MCP server and an `llms.txt` docs index.