Text Element

1. Shape

interface TextClip extends BaseClip {
  type: "text";
  text: string;
}

2. Supported fields

`text`

Type: string
Required: yes
Purpose: text content

Common style fields

Most frequently used with text:

style.fontFamily
style.fontSize
style.fontWeight
style.fontStyle
style.lineHeight
style.letterSpacing
style.textAlign
style.textWrap
style.fill
style.stroke
style.strokeWidth
style.shadowColor
style.shadowBlur
style.shadowOffset

3. Good use cases

Headlines
Sub-headlines
CTA text
Template copy blocks
Numeric countdowns
Quote text

4. Current runtime behavior

Text style support is relatively complete
Animations, keyframes, and transitions can be layered on top
Positioning is mainly driven by transform.x / y

5. Example

{
  "type": "text",
  "start": 1,
  "duration": 3,
  "text": "Launch Today",
  "transform": {
    "x": "50%",
    "y": "20%"
  },
  "style": {
    "fontSize": 64,
    "fontWeight": 700,
    "fill": "#ffffff",
    "textAlign": "center",
    "shadowColor": "#000000",
    "shadowBlur": 20
  },
  "animations": [
    {
      "type": "slideIn",
      "direction": "up",
      "distance": 100,
      "duration": 0.6
    }
  ]
}

On this page