Animations

This page is generated from mcp-catalog.json. Do not edit it by hand.

Source: paper3 local extraction on 2026-05-29. Generated: 2026-05-29T11:34:45.044Z.

`list_animation_presets`

List CSS animation presets

Returns the catalogue of animation presets set_animation accepts. Each entry includes id, name, category, description, default trigger, and the per-instance knobs the preset reads. Cheap discovery call — use it once per session before binding animations so you know which presets exist + which knobs apply.

Parameters

This tool accepts an empty object.

Input schema

{
  "type": "object",
  "properties": {},
  "additionalProperties": false
}

`read_animations`

Read animations + behaviors + class-state overlays on a node

Surgical reader for the interactive layer of a node. Returns the authored stack ONLY — no resolution against preset defaults, no inherited cascade. Pairs with set_animation / set_node_behaviors / update_class_styles / remove_class_styles.

INPUT SHAPES: • \{nodeId\} — one node, returns \{ nodeId, nodeType, animations, legacyAnimation?, behaviors, classStyles \}. • \{nodeIds: [a, b, c]\} — many nodes, returns \{ nodes: \{a: \{...\}, b: \{...\}\}, missing: [...] \}.

Empty arrays / objects when nothing is authored — explicit so the agent sees the absence. Use BEFORE set_animation so you don't blindly overwrite an existing fade-up with a different preset. The full ANIMATION_PRESETS catalogue is available via list_animation_presets (call once per session, not per turn — descriptions are stable).

Parameters

Parameter	Type	Required	Description
`nodeId`	`string`	No
`nodeIds`	`array`	No
`_site`	`string`	No	Optional target site formatted as <workspaceSlug>/<siteSlug>. Required when the workspace has multiple sites and no site header is set.

Input schema

{
  "type": "object",
  "properties": {
    "nodeId": {
      "type": "string"
    },
    "nodeIds": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "_site": {
      "type": "string",
      "description": "Optional target site formatted as <workspaceSlug>/<siteSlug>. Required when the workspace has multiple sites and no site header is set.",
      "pattern": "^[^/]+/[^/]+$"
    }
  },
  "additionalProperties": false
}

`set_animation`

Bind animation presets to a node (one or many)

Attaches CSS-only animation presets to a node. Read first — read_animations(\{nodeId\}) shows the current stack so you don't blindly overwrite. Multiple bindings stack — CSS composes them via a comma-separated animation: shorthand, so combining fade-up + scale-in on load is a single call. Pass animations: [] (empty array) to clear every binding. Pass animation (singular, with the wrapping object) as legacy back-compat — equivalent to animations: [animation].

Run list_animation_presets once per session for every preset's id, category, default trigger, and the per-instance knobs it surfaces.

Triggers: • load — auto-runs once on page load. Default for entry presets. • scroll — runs once when the node enters the viewport (reuses the scrollReveal IntersectionObserver shim, no extra setup). • hover — runs while :hover is active. Default for hover-* presets. • loop — runs continuously (iteration-count: infinite). Default for loop presets (float, pulse-soft, marquee, …).

Knobs (every preset surfaces only the ones its keyframes actually use; defaults fall back to sensible per-preset values): TIMING • durationMs / delayMs — timing in ms. • easing — any CSS easing function. Default is a premium easeOutQuint. TRANSFORM ENDPOINTS • distancePx — translate distance for fade-* / slide-* (when expressed in px) / float / bob / hover-lift. • scaleFrom, scaleTo — both endpoints of a scale animation. scaleTo is the new key for hover-scale and scale-in. • scalePeak — overshoot scale at the mid-keyframe of pop. • rotationDeg — rotation amount for spin, flip-x/y (tilt), wiggle (peak). • perspectivePx — perspective for 3D flip presets. Lower is fish-eye, higher is subtle. VISUAL • blurFromPx, blurToPx — both endpoints of blur presets. • opacityFrom, opacityTo, opacityDip — entry endpoints + breathe-loop dip. • color — accent for glow-pulse / hover-glow / shimmer. Any CSS color. • glowSpreadPx, glowMaxAlpha — box-shadow spread + peak alpha for glow presets. • letterSpacingFromEm, letterSpacingToEm — tracking endpoints for tracking-in / focus-reveal. • trackOffsetPct — slide / marquee / clip-up / shimmer travel distance as %. • clipReachPct, clipOriginX, clipOriginY — circle-reveal radius + origin. PLAYBACK • iterationCount — number, or "infinite". • direction — normal / reverse / alternate / alternate-reverse. • fillMode — none / forwards / backwards / both. • transformOrigin — center center, top left, etc. Pairs with scale/rotate presets. • scrollThreshold (scroll only) — fraction 0–1 of viewport visibility before firing. Default 0.15. • scrollOnce (scroll only) — true (default) fires once; false re-fires every re-entry.

Examples: • Hero copy with a tracking-in + fade-up combo: set_animation(\{ nodeId, animations: [\{ preset: 'tracking-in', durationMs: 700 \}, \{ preset: 'fade-up', distancePx: 24, delayMs: 100 \}] \}). • Scroll-reveal card: set_animation(\{ nodeId, animations: [\{ preset: 'fade-up', trigger: 'scroll' \}] \}). • Marquee strip: set_animation(\{ nodeId, animations: [\{ preset: 'marquee', durationMs: 30000 \}] \}). • Hover lift + glow stack: set_animation(\{ nodeId, animations: [\{ preset: 'hover-lift' \}, \{ preset: 'hover-glow' \}] \}).

INPUT SHAPES (pick whichever fits — the model-side framing overhead drops linearly with the number of tool calls): • \{ nodeId, ...patch \} — one node, one patch. • \{ nodeIds: [id1, id2, …], ...patch \} — same patch fanned out to many nodes (the 'multi-select' shape — use whenever 3+ nodes get the same change). • \{ updates: [\{ nodeId, ...patch \}, …] \} — different patches per node, batched in one call (use whenever 3+ nodes get different changes; far cheaper than N separate calls). Missing nodes are skipped silently. The result is \{ ok: true, applied, skipped \}.

Parameters

Parameter	Type	Required	Description
`nodeId`	`string`	No
`nodeIds`	`array`	No
`updates`	`array`	No
`animation`	`unknown`	No
`animations`	`array`	No
`_site`	`string`	No	Optional target site formatted as <workspaceSlug>/<siteSlug>. Required when the workspace has multiple sites and no site header is set.

Input schema

{
  "type": "object",
  "properties": {
    "nodeId": {
      "type": "string"
    },
    "nodeIds": {
      "type": "array",
      "items": {
        "type": "string"
      }
    },
    "updates": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "nodeId": {
            "type": "string"
          },
          "animation": {},
          "animations": {
            "type": "array",
            "items": {
              "type": "object",
              "properties": {
                "preset": {
                  "type": "string"
                },
                "trigger": {
                  "type": "string",
                  "enum": [
                    "load",
                    "scroll",
                    "hover",
                    "loop"
                  ]
                },
                "durationMs": {
                  "type": "number"
                },
                "delayMs": {
                  "type": "number"
                },
                "easing": {
                  "type": "string"
                },
                "distancePx": {
                  "type": "number"
                },
                "scaleFrom": {
                  "type": "number"
                },
                "scaleTo": {
                  "type": "number"
                },
                "scalePeak": {
                  "type": "number"
                },
                "blurFromPx": {
                  "type": "number"
                },
                "blurToPx": {
                  "type": "number"
                },
                "opacityFrom": {
                  "type": "number"
                },
                "opacityTo": {
                  "type": "number"
                },
                "opacityDip": {
                  "type": "number"
                },
                "rotationDeg": {
                  "type": "number"
                },
                "perspectivePx": {
                  "type": "number"
                },
                "letterSpacingFromEm": {
                  "type": "number"
                },
                "letterSpacingToEm": {
                  "type": "number"
                },
                "trackOffsetPct": {
                  "type": "number"
                },
                "clipReachPct": {
                  "type": "number"
                },
                "clipOriginX": {
                  "type": "number"
                },
                "clipOriginY": {
                  "type": "number"
                },
                "glowSpreadPx": {
                  "type": "number"
                },
                "glowMaxAlpha": {
                  "type": "number"
                },
                "color": {
                  "type": "string"
                },
                "iterationCount": {
                  "anyOf": [
                    {
                      "type": "number"
                    },
                    {
                      "const": [
                        "infinite"
                      ]
                    }
                  ]
                },
                "direction": {
                  "type": "string",
                  "enum": [
                    "normal",
                    "reverse",
                    "alternate",
                    "alternate-reverse"
                  ]
                },
                "fillMode": {
                  "type": "string",
                  "enum": [
                    "none",
                    "forwards",
                    "backwards",
                    "both"
                  ]
                },
                "transformOrigin": {
                  "type": "string"
                },
                "scrollThreshold": {
                  "type": "number"
                },
                "scrollOnce": {
                  "type": "boolean"
                }
              },
              "required": [
                "preset"
              ],
              "additionalProperties": false
            }
          }
        },
        "required": [
          "nodeId"
        ],
        "additionalProperties": false
      }
    },
    "animation": {},
    "animations": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "preset": {
            "type": "string"
          },
          "trigger": {
            "type": "string",
            "enum": [
              "load",
              "scroll",
              "hover",
              "loop"
            ]
          },
          "durationMs": {
            "type": "number"
          },
          "delayMs": {
            "type": "number"
          },
          "easing": {
            "type": "string"
          },
          "distancePx": {
            "type": "number"
          },
          "scaleFrom": {
            "type": "number"
          },
          "scaleTo": {
            "type": "number"
          },
          "scalePeak": {
            "type": "number"
          },
          "blurFromPx": {
            "type": "number"
          },
          "blurToPx": {
            "type": "number"
          },
          "opacityFrom": {
            "type": "number"
          },
          "opacityTo": {
            "type": "number"
          },
          "opacityDip": {
            "type": "number"
          },
          "rotationDeg": {
            "type": "number"
          },
          "perspectivePx": {
            "type": "number"
          },
          "letterSpacingFromEm": {
            "type": "number"
          },
          "letterSpacingToEm": {
            "type": "number"
          },
          "trackOffsetPct": {
            "type": "number"
          },
          "clipReachPct": {
            "type": "number"
          },
          "clipOriginX": {
            "type": "number"
          },
          "clipOriginY": {
            "type": "number"
          },
          "glowSpreadPx": {
            "type": "number"
          },
          "glowMaxAlpha": {
            "type": "number"
          },
          "color": {
            "type": "string"
          },
          "iterationCount": {
            "anyOf": [
              {
                "type": "number"
              },
              {
                "const": [
                  "infinite"
                ]
              }
            ]
          },
          "direction": {
            "type": "string",
            "enum": [
              "normal",
              "reverse",
              "alternate",
              "alternate-reverse"
            ]
          },
          "fillMode": {
            "type": "string",
            "enum": [
              "none",
              "forwards",
              "backwards",
              "both"
            ]
          },
          "transformOrigin": {
            "type": "string"
          },
          "scrollThreshold": {
            "type": "number"
          },
          "scrollOnce": {
            "type": "boolean"
          }
        },
        "required": [
          "preset"
        ],
        "additionalProperties": false
      }
    },
    "_site": {
      "type": "string",
      "description": "Optional target site formatted as <workspaceSlug>/<siteSlug>. Required when the workspace has multiple sites and no site header is set.",
      "pattern": "^[^/]+/[^/]+$"
    }
  },
  "additionalProperties": false
}

On this page