Overview

Motion is Motionly’s readable source format for canvas, elements, tracks, clips, audio, and animations.

Motion Language Reference

.motion is Motionly’s source format. The editor should create and update it visually, but agents and contributors need to keep the syntax clean.

Canvas

canvas {
  size 1920x1080
  fps 60
  duration 5s
  background #020308
}

Text

text title {
  value "Motion graphics"
  center
  x 0
  y 0
  size 72
  color #ffffff
  opacity 1
}

Use size, not fontSize.

Asset

import "./assets/logo.svg" as logo

logo {
  center
  width 240
  opacity 1
}

import accepts PNG/JPEG, static or animated SVG, GIF, MP4, WebM, MOV/M4V, and .lottie. Animated assets use the same editable layer transforms and timeline clip syntax as images.

Animation

animate title {
  from {
    opacity 0
    y 80
    blur 10
  }

  to {
    opacity 1
    y 0
    blur 0
  }

  duration 1.2s
  delay 0s
  easing power3.out
}

Use easing, not ease.

Useful Properties

• x
• y
• width
• height
• scale
• rotation
• originX / originY (normalized transform origin)
• skewX / skewY
• opacity
• blur
• brightness
• shadow
• size
• color
• fill, stroke, strokeWidth (simple path SVG overrides)
• center
• layer

Audio

audio "/assets/my-project/background.mp3" {
  start 0s
}

Audio files persist in .motion, play during preview, remain on the bottom track, and export with MP4. Dragging audio horizontally updates start.

Timeline Tracks and Clips

track main {
  label "Main Track"
  role main
  content primary
  order 0
}

track titles {
  label "Text Overlay"
  role overlay
  content text
  hidden false
  order 1
}

import "/assets/my-project/video.mp4" as bgVideo

clip bgVideo {
  track main
  start 0s
  duration 5s
  trimIn 0s
  trimOut 0s
}

text title {
  value "Editable title"
  track titles
  start 1s
  duration 3s
}

Track roles are main, overlay, and audio. Track content records legacy/purpose metadata (primary, video, image, text, effect, or audio). Visual roles and content do not restrict editing: every visual track behaves as a simple layer, accepts any visual content, and allows gaps or overlaps. hidden suppresses a visual track, muted disables track audio, and order persists layer stacking. Audio remains bottom-only.

Media clips use start, duration, trimIn, and trimOut. Regular text/image/overlay/effect elements use start and duration as a non-destructive visibility window, so trimming and splitting do not rewrite authored animations. Existing numeric clip tracks remain backward compatible.

Easing

Preferred:

• power3.out
• smooth
• soft
• ease-out
• linear

Product Rule

Do not make .motion authoring the main user workflow. Keep it readable because it is the source of truth, but build UI controls first.