# Guide: install-motionspec-mcp-claude

Canonical: https://motionspec.dev/blog/install-motionspec-mcp-claude

How to add the MotionSpec MCP to Claude — MotionSpec

MotionSpec
← All guides

Guide

## How to install the MotionSpec MCP in Claude — and what it gets you

Kevin Fröba · 2026-07-13 · MotionSpec

The MotionSpec MCP server is one URL: https://api.motionspec.dev/mcp . It's free, keyless and remote (Streamable HTTP) — there is nothing to install locally, no API key to manage, and nothing you send is stored. It exposes two tools, motion_catalog and motion_validate , that turn UI animation from something a model improvises into something it composes and verifies. Setup takes about two minutes in any MCP client; if you want to see the tools working before connecting anything, the browser playground runs the live validator with zero setup.

## Claude Code — one command
```bash
claude mcp add --transport http motionspec https://api.motionspec.dev/mcp
```

Then type /mcp in Claude Code to confirm the server is connected and both tools are listed. From that point Claude can call them in any session.

## Claude Desktop

In current builds: Settings → Connectors → "Add custom connector" — name it MotionSpec , paste https://api.motionspec.dev/mcp , and save. Because the server is keyless, there is no OAuth step and no token field; the connector is usable immediately.

## Cursor and other MCP clients

Any client that speaks MCP over Streamable HTTP works with the standard configuration block:
{
```json
{
  "mcpServers": {
    "motionspec": { "url": "https://api.motionspec.dev/mcp" }
  }
}
```

## What the two tools actually do

motion_catalog returns the 40 reviewed animation primitives and their authoring rules — names, parameters, and bounds. This changes what the model is doing: instead of free-writing CSS keyframes or GSAP calls from statistical memory, it composes from a bounded, reviewed set . The catalog is the vocabulary.

motion_validate checks a finished MotionSpec against the schema, the primitive allow-list, parameter bounds and injection rules. It is fail-closed : anything off — a primitive that doesn't exist, a duration outside bounds, a suspicious selector — returns a precise, machine-readable error instead of passing through. This is the same trust boundary the compiler uses.

## Why connect it — the practical advantages

Hallucinated animation gets caught before it ships. Generated code full of plausible-but-nonexistent APIs fails at runtime, where debugging is slow. A spec that names a nonexistent primitive fails validation instantly, with an error the agent can act on in one step.

Accessibility and budget are defaults, not requests. Specs declare respectReducedMotion ; the catalog's primitives carry the reduced-motion guard and performance budget by construction — a property of the output, not a hope in the prompt.

Deterministic, cacheable results. The same validated spec always compiles to the same output — fewer regenerations, fewer surprises between builds. (More on the economics in why a motion spec cuts token costs .)

Zero friction. No key, no account, no stored data — the barrier to letting your agent verify its motion is one URL. (How per-call payment for agents works — and where MotionSpec stands — is covered in x402: how AI agents pay per API call: https://motionspec.dev/blog/x402-agentic-payments )

## FAQ

## Do I need an API key?

No. The server is public and keyless. Add the URL and it works.

## Is anything I send stored?

No. Specs are validated and the result is returned — nothing is kept.

## Which clients are supported?

Claude Code, Claude Desktop (custom connector), Cursor, and any other MCP client that supports remote servers over Streamable HTTP.

## Catalog vs. validate — when do I use which?

Fetch motion_catalog once so the model knows the vocabulary; call motion_validate on every spec before compiling or shipping it.

Try it without installing anything.

The browser playground runs the live motion_validate tool — paste a spec, see the exact errors an agent would see.
Open the MCP playground

Generating web UI at scale? See the Design Partner Program.

MotionSpec checks and compiles UI animation for AI-generated web apps — it does not generate AI video.

MotionSpec All guides Free motion check MCP docs Pricing Impressum Datenschutz

MotionSpec enforces reduced-motion safety and a performance budget for the motion it compiles; it is not a general accessibility guarantee and does not claim conformance with any specific accessibility law. © 2026 Fröba Sales Solutions UG (haftungsbeschränkt).

Canonical connector docs: https://motionspec.dev/docs — packages: https://motionspec.dev/pricing