API Reference

Text Animations

Add per-character animations to text layers. 12 animation types with customizable timing and effects.

Endpoint

bash

GET /api/v1/text-animations

Returns all available animation types with their parameters and defaults.

Animation Types

12 types

wave       - Sine wave displacement (vertical/horizontal)
rotate     - Per-character rotation
scale      - Breathing/pulse effect
orbit      - Circular motion
bounce     - Vertical bounce with physics
shake      - Random jitter
spiral     - Combined orbit + scale
typewriter - Characters appear one by one
glitch     - Digital glitch with color split
elastic    - Rubber band snap effect
cascade    - Waterfall falling effect
neon       - Flickering neon glow

Common Parameters

All animation types share these base parameters:

Parameter	Type	Default	Description
`speed`	number	1.0	Animation speed (0.1-5.0)
`amplitude`	number	50	Intensity (0-100)
`staggerDelay`	number	150	Delay between characters in ms (0-500)
`staggerMode`	string	sequential	sequential, random, center-out, edges-in
`loop`	boolean	true	Loop the animation

Example Text Layer

layer.json

{
  "type": "text",
  "content": "Hello World",
  "fontFamily": "DM Sans",
  "fontSize": 64,
  "color": "#ffffff",
  "animation": {
    "mode": "animated",
    "animation": {
      "type": "wave",
      "enabled": true,
      "speed": 1.0,
      "amplitude": 50,
      "staggerDelay": 150,
      "staggerMode": "sequential",
      "loop": true,
      "frequency": 2,
      "axis": "vertical"
    }
  }
}

MCP Usage

When using the MCP server, pass animation parameters directly to add_layer:

add_layer

// Using MCP add_layer tool
{
  "type": "text",
  "content": "Animated Text",
  "animationType": "typewriter",
  "animationSpeed": 0.8,
  "animationStaggerDelay": 100
}

Tip

Use list_text_animations in Claude Code to see all animation types with their specific parameters.

Stagger Modes

sequential: Characters animate left to right
random: Random delay per character
center-out: Animation spreads from center
edges-in: Animation starts from edges, meets in center