motion-dev-react-mcp

Motion for React — inside your AI assistant.
33 APIs. Correct imports. Accurate defaults. No hallucinations.

Install

Claude Code

claude mcp add motion-dev-react-mcp -- npx -y @orkait-ai/motion-dev-react-mcp

Cursor / Windsurf / any MCP client

{
  "mcpServers": {
    "motion-dev-react-mcp": {
      "command": "npx",
      "args": ["-y", "@orkait-ai/motion-dev-react-mcp"]
    }
  }
}

git clone https://github.com/orkait/motion-dev-react-mcp.git
cd motion-dev-react-mcp && npm install && npm run build
claude mcp add motion-dev-react-mcp -- node $(pwd)/dist/index.js

What it does

Your AI writes Motion code that actually works — because it can look up the real API instead of guessing.

// Without MCP — AI hallucinates
import { useViewportScroll } from "framer-motion"  // wrong

// With MCP — AI looks it up
import { useScroll, useTransform } from "motion/react"  // correct
const { scrollYProgress } = useScroll({ target: ref, offset: ["start end", "end start"] });

Tools

Coverage

33 APIs — verified against motiondivision/motion v12 source code.

14 example categories — animation, gestures, scroll, layout, exit, drag, hover, SVG, transitions, variants, keyframes, spring, reorder, performance.

Every prop, every default, every example — cross-referenced against the source, not just the docs.

Why this over the other one

Contributing

PRs welcome. Open an issue if Motion adds new APIs or you spot an inaccuracy.

Motion+ paid components (AnimateNumber, Carousel, Cursor, ScrambleText, Ticker, Typewriter) are intentionally excluded.

License

MIT © Orkait