Subframe Motion

com.subframe/motionVersion 1.0.0

Open-source React animations, Motion components and WebGL shaders.

Status

Responds233 msNov 14, 2026, 14:18 UTCAnswered our handshake without sign-in.

Registry data may be out of date

We could not refresh it, so this page shows the last copy.

Last checked: Nov 14, 2026, 14:18 UTC
Latency: 233 ms
Remotes responding: 1 of 1
Sign-in: No sign-in
Hosting: Hosted outside the EU (detected)
Registry data as of: Nov 14, 2026, 21:12 UTC

Data from the official MCP Registry, checked by run.zero. How we check

Connect

Streamable HTTP

https://mcp.subframe.com/motion/mcpResponds233 msNov 14, 2026, 14:18 UTC

No sign-in

Claude Code

claude mcp add --transport http motion https://mcp.subframe.com/motion/mcp

Claude Desktop and claude.ai

1
2
3

Settings > Connectors > Add custom connector
Name: motion
Remote MCP server URL: https://mcp.subframe.com/motion/mcp

Cursor

{
  "mcpServers": {
    "motion": {
      "url": "https://mcp.subframe.com/motion/mcp"
    }
  }
}

VS Code

code --add-mcp '{"name":"motion","type":"http","url":"https://mcp.subframe.com/motion/mcp"}'

Built your own server? run.zero hosts MCP servers on European infrastructure.

Host your own MCP server on run.zero

Tools

3 tools

Tools of Subframe Motion
	Description		Read-only	Idempotent	Open world
`get_motion_example`Get one Subframe Motion Library example: its complete React source; how it looks and moves; adapt notes naming the code that drives the motion and what to change; the npm packages to install (none means React only); the images its code loads from /motion/assets/ with download URLs (serve them there or change the paths); reduced-motion behavior and limitations; its licence and upstream credit; related examples; the guidance topics worth reading; and a preview image. Use a slug from search_motion_examples or from a www.subframe.com/motion/<slug> URL. This writes no files: adapt the code to the project, keep its licence header, and test it there. The code targets React 19; with React 18 server rendering, move its inline <style> CSS into a stylesheet, since React 18 escapes the CSS's quotes and > characters.	Get one Subframe Motion Library example: its complete React source; how it looks and moves; adapt notes naming the code that drives the motion and what to change; the npm packages to install (none means React only); the images its code loads from /motion/assets/ with download URLs (serve them there or change the paths); reduced-motion behavior and limitations; its licence and upstream credit; related examples; the guidance topics worth reading; and a preview image. Use a slug from search_motion_examples or from a www.subframe.com/motion/<slug> URL. This writes no files: adapt the code to the project, keep its licence header, and test it there. The code targets React 19; with React 18 server rendering, move its inline <style> CSS into a stylesheet, since React 18 escapes the CSS's quotes and > characters.	No	Yes	Yes	No
`get_motion_guidance`Get Subframe's guidance for designing motion well, by topic: principles (whether to animate at all), timing (durations, curves, springs), enter-exit (menus, dialogs, toasts), feedback (hover, press, state, loading), scroll, ambient (loops, backgrounds, shaders), text-and-numbers, performance, accessibility and adapting (turning a library example into project code). Read the relevant topics before designing, adapting or reviewing any animation, not only library examples.	Get Subframe's guidance for designing motion well, by topic: principles (whether to animate at all), timing (durations, curves, springs), enter-exit (menus, dialogs, toasts), feedback (hover, press, state, loading), scroll, ambient (loops, backgrounds, shaders), text-and-numbers, performance, accessibility and adapting (turning a library example into project code). Read the relevant topics before designing, adapting or reviewing any animation, not only library examples.	No	Yes	Yes	No
`search_motion_examples`Search the Subframe Motion Library for React animation examples. Describe what you want in plain words — the effect, the element, how it should feel, or, when matching a screenshot, what it looks like and what moves ('glowing border sweeping around a dark pricing card', 'playful press feedback for a like button', 'calm shader background behind a headline'). Results come most relevant first, with how each one looks; call get_motion_example with a slug for its code. If nothing fits closely, the result says so. Search reads plain language but not negations, so put hard constraints in the filters (runtime react means no animation library). Leave the query empty to browse a category or runtime.	Search the Subframe Motion Library for React animation examples. Describe what you want in plain words — the effect, the element, how it should feel, or, when matching a screenshot, what it looks like and what moves ('glowing border sweeping around a dark pricing card', 'playful press feedback for a like button', 'calm shader background behind a headline'). Results come most relevant first, with how each one looks; call get_motion_example with a slug for its code. If nothing fits closely, the result says so. Search reads plain language but not negations, so put hard constraints in the filters (runtime react means no animation library). Leave the query empty to browse a category or runtime.	No	Yes	Yes	No

Details

Registry status: Active
Published: Nov 13, 2026
Updated: Nov 13, 2026
Website: https://www.subframe.com/motion⁠ (opens in a new tab)
Repository: Not given
Categories (suggested): Design and mediaSuggested categories are assigned automatically from the registry text and may be wrong. Verified operators can correct them.
GDPR: Not declared

Are you the operator? Claim this listing