motionspec
MotionSpec MCP server supports authoring, validating, compiling, auditing, and telemetry for web animation accessibility.
Retrieve the catalog of verified motion primitives and authoring rules (
motion_catalog).Validate a MotionSpec against schema, primitive allow-list, parameter bounds, and injection rules with fail-closed diagnostics (
motion_validate).Deterministically compile a valid spec to vanilla-GSAP JavaScript and CSS, with reduced-motion defaults and performance warnings (
motion_compile).Statically audit a live URL's HTML and linked CSS for reduced-motion guards, pause paths, non-transform/opacity animation, and marquee/autoplay issues (
motion_audit).Summarize routing/compile telemetry and escalation clusters (
motion_stats).Locally, all five tools run over stdio without an API key; hosted access is keyless for the first four, with
motion_statsoperator-only.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@motionspecCreate a parallax scrolling effect for the hero background"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
MotionSpec — web animation accessibility MCP server
MotionSpec is an MCP server and CLI for web animation accessibility. It helps AI coding agents and frontend developers compile validated animation specs to deterministic GSAP + CSS and find motion-accessibility candidates in a page's loaded CSS: missing prefers-reduced-motion guards and missing pause paths for continuous animation.
The MIT compiler includes reduced-motion handling and loop pause controls by default. Its static audit supports review of WCAG 2.2.2 (Pause, Stop, Hide — Level A) and WCAG 2.3.3 (Animation from Interactions — Level AAA). Findings need contextual review; a clean scan is not a full accessibility or WCAG-conformance assessment. Runtime JavaScript animation, flashing, video and Canvas are outside the audit's scope.
Create web animation: choose a catalog primitive, validate a JSON spec, then compile vanilla-GSAP JavaScript and CSS. The internal WAAPI lowering is not a public build target.
Check CSS motion: audit a URL for reduced-motion and pause-path candidates, then review the reported selectors and suggested fixes.
Prevent regressions: use the CI example to compare findings against an explicitly accepted baseline.
Local stdio MCP exposes all five tools without an API key (npx -y motionspec). The hosted endpoint at https://api.motionspec.dev/mcp provides keyless motion_catalog, motion_validate, motion_compile and motion_audit; only motion_stats (the operator's telemetry of the hosted service) requires the operator key. See the installation guide and motion accessibility guide. Docs and product: https://motionspec.dev/docs.
The thesis: capability lives in the catalog, not the model. A bigger model can write more elaborate specs, but it can never emit a primitive, parameter, or selector the Trust Boundary hasn't approved. The compiler trusts only what passes.
request ──> Routing (small model, Stage A) ──> MotionSpec (JSON)
│ cache · 1 repair-retry · escalation │
▼ ▼
telemetry TRUST BOUNDARY (fail-closed)
│
┌─────────────┴─────────────┐
▼ ▼
Compiler (no model, Stage B) WAAPI lowering (internal — no CLI/MCP path yet)
│ │
out/*.motion.js + .css Element.animate / IO / @keyframesNot to be confused with
Not to be confused with: the Android Material Components
MotionSpecclass, the iOS material-motionMotionSpec, Motion.dev / Framer Motion, the usemotion.com calendar app, the Motion Specialties mobility brand, or text-to-video generators (Runway/Sora/Kling/Viggle). MotionSpec checks the UI animation inside web apps — it does not generate video.
60-second start
npx motionspec # stdio MCP server — no install needed
claude mcp add motionspec -- npx motionspec # register in Claude Code / any MCP host
npm install -g motionspec # or take the CLI:
motion compile spec.json # deterministic build → ./out in your cwdThe host LLM authors the spec; the Trust Boundary stays enforced either way. Listed on the MCP Registry as io.github.MasterPlayspots/motionspec. A hosted MCP endpoint is live: keyless motion_catalog, motion_validate, motion_compile and motion_audit at https://api.motionspec.dev/mcp (streamable-http; motion_stats is operator-only) — setup: https://motionspec.dev/docs.
In ChatGPT: MotionSpec is listed in the ChatGPT plugin directory. It offers motion_catalog and motion_validate, no login. It does not compile or check websites; for that, use the hosted endpoint above or the local server. No MotionSpec tool certifies accessibility. Listing: https://chatgpt.com/plugins/plugin_asdk_app_6ad7946fedac819183fb38ac85520e4b
Claude Code plugin
This repo is also a Claude Code plugin: it bundles the MCP server (npx motionspec, all five tools, local, keyless) with two skills — /motionspec:motion (the author→validate→compile workflow) and /motionspec:audit <url> (motion-accessibility check, WCAG 2.2.2/2.3.3). Try it directly from a clone with claude --plugin-dir ., or install it from the community marketplace once listed:
/plugin marketplace add anthropics/claude-plugins-community
/plugin install motionspec@claude-communityRelated MCP server: GSAP MCP Server
Status
Version | v1.2.12 · schema frozen at spec v1 (ADR-0001, signed) |
Published | npm |
Tests | 376 green — injection attacks, 6000-spec fuzz, golden determinism, schema parity, pause-controls, motion-a11y audit · CI on Node 18/20/22 + x86 Playwright e2e |
Catalog | 40 primitives, every one device-verified, reduced-motion-fallback mandatory; the 18 continuous loops also carry a WCAG-2.2.2 pause path |
Supply chain | 2 runtime deps (MCP SDK, zod — both pinned) · 0 vulnerabilities · CycloneDX SBOM regenerated and checked in CI · all permissive licenses · CI actions SHA-pinned |
Coverage | 97.23% lines / 95.17% functions / 80.82% branches of |
Last audit | 2026-07-03 — 17/17 integration handshakes evidenced, infra 8.1/10, security: 0 critical, full-git-history secret scan clean |
First client | CHS Computer — live on Vercel |
Hosted MCP | live — keyless |
Schema v1 is frozen: specVersion "1.0" is the stable public contract; "0.1" is deprecated and accepted until v1.2 (a tripwire test enforces the revisit). The [MS-XXX] error-code registry is public API — codes are never reused or redefined.
What the compiler guarantees
Allow-list — a primitive not in the catalog never reaches the compiler.
Injection-proof — ids, selectors, string params and triggers are charset-validated; every interpolation is a JS literal (
JSON.stringify) or a CSS-screened raw value through one shared safety gate (safety.js). Malicious model output is rejected fail-closed — tested and fuzzed over 6000 random specs.a11y by construction (motion) — safe defaults, enforced gates, and proof per build.
respectReducedMotionis default-on at the compiler level (fail-safe): omitting it still yields aprefers-reduced-motionguard. Opting out is possible but emitsMS-GLOBALS-RRM-OFF; a prompt-side instruction alone can never disable the guard.Pause/Stop for loops (WCAG 2.2.2) — every continuous loop primitive is tagged
a11y.persistent, and the compiler emits a pause path by construction: ananimation-play-state: pausedrule keyed onhtml[data-ms-paused](outside the reduced-motion guard, so it is always live) plus, underpauseControls: "auto"(the fail-safe default), one accessible pause/stop toggle (type="button",aria-pressedin sync, ≥24 px target, visible focus ring, not rendered under reduced motion).pauseControls: "api"keeps the CSS contract and leaves the control to the integrator;"off"opts out but emitsMS-GLOBALS-PAUSE-OFFwhen a persistent motion is present. The promote-gate refuses anyinfinite/repeat:-1primitive that is nota11y.persistent. A spec with no loops adds zero extra bytes.Determinism — same spec ⇒ byte-identical code (golden-file tests for the GSAP output and for the internal WAAPI lowering).
Versioned — schema frozen v1; catalog SemVer enforced by a diff-gate (a tightened bound shipped as a "patch" fails CI); specs may pin
catalogVersionfor reproducibility (MS-CATALOG-PIN-MISMATCHfail-closed).Observability — every request logs
model | model-repaired | cache-hit | escalate-*(local: JSONL sink · hosted: Cloudflare Analytics Engine, PII-scrubbed). Escalation clusters are the growth signal for new primitives.
One build target, one internal lowering
What you can get out of the compiler today, through the CLI or the MCP tools, is exactly one target:
vanilla-gsap— GSAP + ScrollTrigger.meta.targetaccepts nothing else (schema frozen at v1).
A second lowering exists in the codebase and is kept green by the test suite, but it is not reachable through any interface:
WAAPI/CSS lowering (
src/compiler/lower-waapi.js) — zero-GSAP output onElement.animate, IntersectionObserver, and@keyframes/position: sticky. Full catalog coverage, byte-identical golden per primitive, same accessibility guard, same CSS safety gate. This is the framework-decoupling hedge: the IR outlives any animation library. Internal — referenced only by the tests andbin/promote-gate.js; there is no CLI flag, no MCP tool and no schema target for it (ADR-0001 freezesmeta.targettovanilla-gsap; engine wiring is out of scope, ADR-0002). Do not plan a build on it until a release note says otherwise.
The catalog grows itself — humans keep the taste
The Catalog Forge (CI workflow, manual dispatch) picks the top telemetry-ranked gap, generates one candidate primitive, drives it through a multi-stage gauntlet — meta-schema, mandatory reduced-motion fallback, performance budget, output determinism (entropy tokens like Math.random/Date.now fail the gate), catalog-SemVer legality, golden creation — and opens a PR. It cannot merge, publish, or deploy: structurally (workflow permissions carry no packages/id-token, PR-only) and by regression test (forge-workflow-guard fails CI if anyone smuggles a publish step in). Gate 1 is always a human taste review.
MCP server
Tool | Contract |
| primitives + authoring rules + catalog version (16-hex pin) |
| fail-closed Trust Boundary; precise |
| deterministic spec → code; never emits on a failed validation |
| static motion-a11y check of a live URL (read-only, open-world) |
| telemetry summary (escalations = catalog growth signal) |
Input is size-capped (MS-INPUT-TOO-LARGE, 64 KB). The stdio server exposes one tool factory as the single source of truth, contract-tested in test/mcp.test.mjs. A hosted MCP endpoint is live: keyless motion_catalog, motion_validate, motion_compile and motion_audit at https://api.motionspec.dev/mcp; motion_stats (operator telemetry) needs the operator key.
Motion-a11y checker
motion audit <url> (CLI, --json for the machine payload) and the motion_audit MCP tool run a static scan of a page's HTML and linked stylesheets — no headless browser, no new dependency. It reports four motion problems: CSS animation/transition without an effective prefers-reduced-motion guard (WCAG 2.3.3 — the guard must win the cascade), animated properties other than transform/opacity, infinite animations with no pause path (animation-play-state/data-*), and <marquee>/autoplay motion over 5 s (WCAG 2.2.2). Colour/opacity-only transitions are not motion under 2.3.3 and are not reported; loading indicators (spinners, skeletons) are listed as review items with no score impact. Each finding carries a selector, the WCAG reference, and a copy-paste fix. The CLI, the motion_audit tool and the free check at motionspec.dev/motion-check run the same engine with the same limits (12 stylesheets, 2 MB, 8 s) and the same score. It is honest about its limits: runtime motion (WAAPI/GSAP/JS, WebGL libraries) is reported as not audited (V2) rather than silently passed, and a page with no CSS motion is status: "not-measurable" with score: null instead of a perfect score. The legacy reduced-motion-safe badge string is returned only for a measurable page with zero findings and no runtime motion library; it means only that these checks found no candidates in the loaded CSS, not that the page or its runtime motion is certified.
Use in CI
motion audit --json is stable enough to gate a pull request. examples/ci/motion-audit.yml is a copy-and-adapt GitHub Actions workflow that builds your site, serves the build directory on localhost, audits the paths you list with npx -y -p motionspec@1.2.8 motion audit <url> --json (local, MIT, no key, no hosted call), and compares each page with a checked-in baseline .motionspec/baseline.json.
The gate fails when a page got worse — the same rule MotionSpec's weekly re-scan uses: the score fell, or the number of Level-A findings (WCAG 2.2.2 Pause, Stop, Hide) rose. Scores are compared only when both runs are measurable and use the same scoring version; a baseline written by 1.2.7 or earlier (scoring v1) needs one re-baseline. A page without a baseline entry never fails; that run is the baseline. Re-baselining is a deliberate manual run (workflow_dispatch with update_baseline: true) that uploads the new file as an artifact for you to commit — the workflow never commits on its own. Fixed findings are listed as - fixed: lines, new ones as + new finding:.
The machine payload is { ok, url, status, score, scoring, scoring_doc, summary, badge, findings, groups, disclosures, coverage }; read status before using score (it is null when the page is not measurable). Note that audit takes a URL, not a directory — hence the local server step. And the scope caveat travels with it: this is a static CSS scan (no inline style="", @import, CSS-in-JS, external JS bundles, video/GIF/Canvas, or flashing checks); a green gate means "no regression in the loaded CSS", not "accessible".
Specification & conformance
MotionSpec is a governed format, not just a tool. The normative spec is SPEC.md (versioned 1.0, RFC-2119 MUST/SHOULD/MAY over the JSON Schema, with a documented ADR-based change process). CONFORMANCE.md defines the five checks (schema, diagnostics, output, determinism, accessibility) an implementation passes to call itself MotionSpec 1.0 compatible, run against the published test/golden corpus. Multiple implementations passing the same corpus is what makes it a standard.
Standards mapping
MotionSpec checks a limited set of motion signals. These are candidates for review, not a conformance verdict or a substitute for testing the delivered interface.
Criterion | Level | What to review with MotionSpec |
A | For non-essential moving, blinking or scrolling content that starts automatically, lasts more than five seconds and appears alongside other content, check for a usable pause, stop or hide mechanism. The compiler supplies loop pause paths by default; the static audit looks for missing-path candidates. Auto-updating content has separate requirements without the five-second threshold. | |
AAA | Non-essential motion triggered by interaction must be disableable. Reduced-motion handling is one implementation approach. A missing media query alone does not establish failure, and finding one does not establish success. |
Animating only transform and opacity is a performance recommendation, not by itself a
WCAG success criterion. The audit does not measure flashing (2.3.1), runtime GSAP/WAAPI,
video, Canvas, or the usability of a pause control. It does not establish compliance with
EN 301 549, Section 508, EAA, BFSG, or any other legal framework.
Quickstart (from a clone)
npm ci # install (0 runtime deps beyond MCP SDK + zod)
npm test # 376 tests: validator, goldens, router, fuzz, parity
node bin/motion.js catalog # primitives + catalog version
node bin/motion.js compile examples/hero.motionspec.json
node bin/motion.js pipeline "Hero headline fades in, cards staggered" --mock
node bin/motion.js stats # telemetry (model / repaired / cache-hit / escalate)Live model instead of --mock: set MOTION_API_KEY (or OPENROUTER_API_KEY); optional MOTION_MODEL (default anthropic/claude-haiku-4.5) and MOTION_BASE_URL (any OpenAI-compatible endpoint). See .env.example.
Gates (run these — they are the contract)
npm test # full suite, fail-closed trust boundary + golden determinism
npm run coverage # FAILS under 90/90/75 (lines/functions/branches)
npm run catalog-lock:check # ADR-0001 D2: a tightened bound shipped as a "patch" fails here
npm run sbom && npm run sbom:check && node bin/license-check.js
npm run e2e # real-browser Playwright (CI x86 runner)Releases run the whole chain plus a canonical-clone guard and finish with a registry truth check — a version is "live" when the npm dist-tag says so, not when a local run went green.
Security
Defense in depth on the hosted path: constant-time admin-secret comparison (no timing side channel on position or length) · customer keys stored hashed (SHA-256) in KV, fail-closed on any lookup error · pre-auth per-IP rate limiting closes the key-enumeration gap before auth work starts, per-key limiting after · throttled abuse alerts with zero PII · telemetry scrubbed before storage · strict CSP/X-Frame-Options/nosniff on the only ungated page (a data-free dashboard shell). Full posture incl. reporting: SECURITY.md. Last audit (2026-07-03): no critical findings, no secret ever committed across 197 commits of history.
Layout
schema/ MotionSpec JSON schema (static contract, parity-tested against the validator)
primitives/ catalog: 40 verified primitives (safe templates)
catalog.lock.json released catalog baseline (SemVer diff-gate)
src/compiler/ validate.js (Trust Boundary) · compile.js (GSAP) · lower-waapi.js (WAAPI/CSS)
safety.js (one shared CSS gate) · keyword-map.js · catalog.js · catalog-semver.js
src/router/ prompt.js · clients.js (openai-compat + mock) · route.js · cache.js · telemetry
src/mcp/ server.mjs (stdio) · register-tools.js (shared tool factory)
src/forge/ generate.js · prioritize.js — the gauntlet-verified catalog forge
src/discover/ gap analysis: request intents ↔ catalog coverage
src/demo/ device-verification demo pages (`?rm=1` simulates reduced motion)
bin/ motion.js (CLI) · promote-gate.js — dev/CI gate scripts stay repo-only
test/ 376 tests incl. injection, fuzz, goldens (GSAP + internal WAAPI lowering), parity; test/e2e (Playwright)
docs/ ADR records (docs/adr/) and per-primitive reference (docs/primitives/)Docs
Web animation accessibility — reduced motion, pause controls, GSAP output, review workflow and audit limits.
Discovery and search measurement — separate registry, GitHub, npm and web search surfaces, with a repeatable query log.
Usage measurement plan — current local telemetry, proposed aggregate hosted counters, and limits of npm download statistics.
AGENTS.md — what a coding agent should know: when to use MotionSpec, the commands, the three motion rules (reduced motion · pause path · no flashing), and what the audit does not check. The same rules in editor form:
.cursor/rules/motionspec.mdcand.github/copilot-instructions.md.SECURITY.md — security posture of the npm package and hosted endpoint.
docs/adr/0001-schema-freeze-v1.md— the frozen v1 contract and why.
Contributing
CONTRIBUTING.md covers setup, the gate-driven PR checklist, commit conventions, golden-file regeneration, and a short architecture tour. Issue templates live under .github/ISSUE_TEMPLATE/.
License
MIT.
Available Tools
5 toolsmotion_auditAudit a live URL for motion accessibility (WCAG 2.2.2 / 2.3.3)ARead-onlyInspect
Static motion-a11y checker: fetches a URL's HTML + linked stylesheets (up to 12 sheets, 2 MB per response, 8 s timeout) and scans the CSS for (1) animation/transition that moves without an effective (cascade-aware) prefers-reduced-motion guard, (2) animated non-transform/opacity properties, (3) infinite animations with no pause path, (4) /autoplay >5s. Colour/opacity-only transitions are not motion (WCAG 2.3.3). Uses scoring v2. Same engine and scoring as the free site check at https://motionspec.dev/motion-check. Returns structuredContent {ok, url, status, score, scoring, scoring_doc, findings, groups, summary, badge, disclosures, coverage} plus a Markdown report in text content, or {ok:false, error} with isError:true on failure. Read status first: pages without CSS motion return status 'not-measurable' with score null; runtime motion such as WAAPI/GSAP/WebGL is not audited. Loading indicators are reported as 'review', not as violations; verify them manually. The 'reduced-motion-safe' badge requires a measurable page with zero findings and no detected runtime motion library. Does network I/O (openWorldHint).
| Name | Required | Description | Default |
|---|---|---|---|
| url | Yes | The page URL to audit (http/https). |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations only declare readOnlyHint and openWorldHint; the description carries all the real behavioral weight — fetch limits (12 sheets, 2 MB per response, 8 s timeout), the reduced-motion-safe badge precondition, the not-measurable path, and the review-vs-violation distinction. It also discloses that network I/O occurs, consistent with openWorldHint.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
Purpose is front-loaded, then constraints, return shape, and caveats in a logical order, with no filler sentences. It is dense but long, and 'Uses scoring v2. Same engine and scoring as the free site check' is mildly redundant.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
With no output schema, the description enumerates the returned fields (ok, url, status, score, findings, groups, summary, badge, coverage) and the error shape with isError:true. Combined with the documented failure and not-measurable modes, an agent has everything needed to call and interpret it.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Only one parameter, and the schema already documents it at 100% coverage as the http/https page URL. The description adds fetch side constraints (sheet count, response size, timeout) that shape expectations but don't add meaning to the url argument itself, so the baseline 3 is appropriate.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description opens with a specific verb+resource: a static motion-a11y checker that fetches a URL's HTML and linked stylesheets and scans CSS for four enumerated motion issues. It is unmistakable next to non-overlapping siblings (motion_catalog, motion_compile, motion_stats, motion_validate), none of which are URL auditors.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
It states clear scope boundaries and exclusions: runtime motion (WAAPI/GSAP/WebGL) is not audited, loading indicators are 'review' not violations, and pages without CSS motion yield status 'not-measurable' with score null. It also tells the agent to read status first. It does not explicitly route to an alternative tool for runtime motion, so it falls short of a full 5.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
motion_catalogMotionSpec catalog & authoring rulesARead-onlyInspect
Returns the catalog of verified motion primitives (names, purpose, parameter schemas, defaults) plus the authoring rules for writing a MotionSpec. Call this FIRST, then write the spec yourself, check it with motion_validate and compile it with motion_compile. Free motion check: https://motionspec.dev/motion-check · paid Motion Report (9 USD, one-time): https://motionspec.dev/pricing?src=mcp-motion_catalog#p-report.
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations already declare readOnlyHint=true and openWorldHint=false, so the safety profile is covered. The description adds useful behavioral context: this is a discovery/priming tool that must precede authoring, and it returns structured reference data rather than performing any operation. It doesn't discuss size of the catalog or pagination, which would have completed the picture.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The tool-relevant content is front-loaded and efficient: one sentence of purpose, one sentence of workflow. However, the trailing 'Free motion check' URL and 'paid Motion Report (9 USD)' pricing link are promotional rather than functional, adding noise an agent must filter when deciding whether to call the tool.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
With no output schema and no parameters, the description carries the burden of describing return content, and it does so by naming the catalog fields. Combined with the explicit sequencing into motion_validate and motion_compile, an agent has enough to call this correctly. The only omission is any sense of catalog size or response format.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The tool takes zero parameters, so the baseline is 4. The description does earn some credit by describing what the (absent) output schema would otherwise document — the returned catalog fields — helping the agent anticipate the result shape.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
States a specific verb and resource ('Returns the catalog of verified motion primitives') and enumerates exactly what's inside (names, purpose, parameter schemas, defaults), plus the authoring rules for writing a MotionSpec. This is clearly distinguishable from siblings like motion_validate or motion_compile, which act on a spec rather than supply the vocabulary for authoring one.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
Gives an explicit ordered workflow: 'Call this FIRST, then write the spec yourself, check it with motion_validate and compile it with motion_compile.' It names both alternative tools and the precise step at which each applies, leaving no inference needed about sequencing.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
motion_compileCompile a MotionSpec to GSAP/CSSARead-onlyIdempotentInspect
Validates (fail-closed) and deterministically compiles a MotionSpec into vanilla-GSAP JavaScript and CSS, with prefers-reduced-motion enabled by default and a performance-budget report. Same spec always yields identical code. Returns {ok:true, js, css, warnings, report, catalogVersion} or {ok:false, errors, catalogVersion}; css may be null when no CSS is emitted. Read warnings before shipping: explicitly disabling reduced-motion or loop pause controls can compile with accessibility warnings. Does not write files or execute the emitted code.
| Name | Required | Description | Default |
|---|---|---|---|
| spec | Yes | The MotionSpec JSON object | |
| specName | No | Optional name used in the artifact header |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations already cover readOnly/idempotent/non-destructive/closed-world, and the description adds substantive behavioral detail on top: fail-closed validation, deterministic output, reduced-motion default, a performance-budget report, and the accessibility-warning caveat. It also explicitly states non-effects (no file writes, no code execution), which is exactly the kind of context annotations can't convey.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
Front-loaded with the core action and result, then return shape, then caveats. It's dense but nearly every clause carries information; the return-shape enumeration is slightly bulky but justified given there's no output schema.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
With no output schema, the description fully specifies the return contract ({ok:true,...} vs {ok:false,...}, css nullable) plus error semantics and side-effect boundaries. Nothing an agent needs to invoke this correctly and interpret results is missing.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema coverage is 100%, so both parameters are already documented in the schema and the baseline applies. The description adds no detail about the MotionSpec object's internal shape or the specName header behavior beyond what the schema states, so it neither compensates nor detracts.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description states a specific verb pair ("Validates and deterministically compiles") and a concrete resource transformation (MotionSpec → vanilla-GSAP JS and CSS). It distinguishes itself from the sibling validate/audit tools by emphasizing compilation output, so an agent can tell what this tool uniquely produces.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description gives implied usage guidance ("Read warnings before shipping", "Does not write files or execute the emitted code") but never explicitly says when to pick this over motion_validate or motion_audit. An agent must infer the routing from the stated output shape rather than from an explicit when-to-use statement.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
motion_statsMotionSpec usage telemetryARead-onlyInspect
Summary of routing/compile telemetry (counts per outcome). Escalation clusters indicate which new primitive the catalog needs next.
| Name | Required | Description | Default |
|---|---|---|---|
No parameters | |||
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
Annotations declare readOnlyHint=true (safe read) and openWorldHint=false. The description adds meaningful behavioral context: it returns aggregated counts per outcome and identifies escalation clusters for catalog needs. This goes beyond the annotations without contradicting them.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is extremely concise with two sentences and no unnecessary words. It is front-loaded with the core purpose ('Summary of routing/compile telemetry') and efficiently conveys the key output.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given there is no output schema, the description adequately describes the return content (counts per outcome, escalation clusters). However, for a telemetry tool, it might be improved by clarifying the time period or data scope, though it is sufficient for basic use.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The tool has zero parameters with 100% schema coverage (empty object). There are no parameters to document, so the description need not add parameter information. Baseline score of 4 is appropriate.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states it provides a summary of routing/compile telemetry with counts per outcome and escalation clusters indicating catalog needs. However, it does not explicitly differentiate from sibling tools like motion_audit or motion_catalog, which could share similar purposes.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
No guidance is provided on when to use this tool versus alternatives. There is no mention of prerequisites, limitations, or comparison with sibling tools. The description only states what it does without any usage context.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
motion_validateValidate a MotionSpec (trust boundary)ARead-onlyInspect
Checks a MotionSpec against the schema, the primitive allow-list, parameter bounds and injection rules. Fail-closed: returns ok=false with precise errors. Returns {ok, errors, warnings, deprecations, catalogVersion}. IMPORTANT: warnings[] carries the WCAG 2.2.2 / reduced-motion findings and can be non-empty while ok=true — a spec that compiles is not automatically accessible. Use to pre-check a spec before compiling.
| Name | Required | Description | Default |
|---|---|---|---|
| spec | Yes | The MotionSpec JSON object |
TDQS
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
The description goes well beyond the readOnlyHint and openWorldHint annotations by disclosing fail-closed behavior, the exact return shape, and the non-obvious fact that warnings can be non-empty while ok=true. It also explains the accessibility implication, which is critical for correct agent behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is compact and front-loaded, with the core validation behavior stated first, followed by the return shape and the critical warning caveat. Every sentence earns its place, and the formatting highlights the most important behavioral nuance.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a single-parameter, read-only validation tool with no output schema, the description fully covers what the tool does, when to use it, what it returns, and the key failure and warning semantics. An agent has sufficient information to select and invoke it correctly without additional context.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
Schema coverage for the single parameter is 100%, so the baseline is 3. The description adds meaningful semantics by clarifying that the spec parameter is a MotionSpec and by enumerating the validation dimensions applied to it, such as the primitive allow-list and injection rules, which the schema alone does not convey.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Does the description clearly state what the tool does and how it differs from similar tools?
The description states a specific verb ('Checks') and a specific resource ('MotionSpec'), then enumerates exactly what it validates against: schema, primitive allow-list, parameter bounds, and injection rules. It clearly distinguishes itself from the sibling motion_compile by positioning validation as a pre-compile safety check.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description explicitly says 'Use to pre-check a spec before compiling,' which gives clear guidance on when to call this tool. It also explains the important warning behavior so an agent knows this is the right tool for accessibility checks before compilation, though it does not explicitly name or exclude alternatives beyond the pre-compile framing.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
5 tool updates
v0.1.0- First observed
motion_audit - First observed
motion_catalog - First observed
motion_compile - First observed
motion_stats - First observed
motion_validate
TDQS
Scored across 5 tools
Each tool targets a distinct stage: catalog (discover primitives/rules), validate (schema/allow-list check of a spec), compile (emit JS/CSS), audit (scan a live URL's CSS), and stats (telemetry). The validate/compile overlap is explicitly disambiguated in the descriptions (pre-check before compiling), and audit vs validate are clearly separated by input type (URL vs spec).
All names use a consistent motion_ prefix with snake_case suffixes and action-oriented suffixes (validate, compile, audit). Minor deviation: catalog and stats are nominal rather than verb-style, but the pattern remains predictable overall.
Five tools map cleanly onto the author-observe pipeline (discover, validate, compile, audit, telemetry) with no filler tools. This is well within the ideal 3-15 range and each tool earns its place.
The surface covers the full spec lifecycle from primitive discovery through validation, compilation, and post-hoc auditing, with sensible fail-closed outputs. Minor gaps exist: no tool writes or applies the compiled output, and runtime motion (WAAPI/GSAP) is acknowledged as unaudited, which agents must work around manually.
Maintenance
Related MCP Connectors
Hosted motion engine for agents. Builds layers and keyframes, exports MP4, WebM or Lottie.
One sentence to a finished animation: your AI writes motion graphics as code and checks real frames.
Make AI-drawn video from chat: your LLM draws every frame in code; add narration, music and SFX.
Search attributed motion recipes and prepare prompts for your coding agent. No API key required.
Related MCP Servers
- AlicenseBqualityDmaintenanceEnables AI models to generate production-ready, 60fps-optimized GSAP animation code from natural language requests. It provides expert-level tools for creating complex sequences, debugging performance issues, and setting up GSAP within modern web frameworks.6151 npm5MIT
- AlicenseCqualityDmaintenanceGenerate GSAP animation code through natural language descriptions and integrate with Claude Desktop for easy animation development.436MIT
- AlicenseBqualityDmaintenanceAnalyzes scroll-triggered animations on any webpage using Playwright, extracting GSAP, ScrollTrigger, Lenis, and CSS code via AST and runtime detection.16MIT
- FlicenseAqualityCmaintenanceMCP server over a catalog of production-grade GSAP and WebGL motion components. Your agent can plan a page's sections, pick a mechanic for each one, get composition rules so animations don't fight each other, and fetch build prompts validated against live demos. Hosted at motionprompts.dev/mcp or local with npx motionprompts-mcp.1453 npm-