Motion language overview

Overview of the .motion language, Motionly’s readable source format for describing canvas settings, 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 is imported and placed exactly like visual media: an import for the file, and one clip per placement on an audio track. The same file can appear as many times as you like.

import "/assets/my-project/background.mp3" as music
import "/assets/my-project/whoosh.mp3" as whoosh

track score { role audio content audio label "Music" }
track sfx { role audio content audio label "Effects" }

clip music { track score start 0s duration 12s volume 0.6 fadeIn 1s fadeOut 2s }
clip whoosh { track sfx start 3.2s duration 0.8s }
clip whoosh { track sfx start 7.5s duration 0.8s }

Audio clips accept the ordinary clip timing properties — start, duration, trimIn, trimOut — plus:

• volume — linear gain, 1 is source level. Values above 1 are clamped, so preview and export always agree.
• mute — silence this clip without changing its volume.
• fadeIn / fadeOut — ramp lengths at the head and tail. Together they never exceed the clip; overlapping fades multiply.
• speed — playback rate, 1 is source speed. A clip at speed 2 consumes twice as much source per timeline second.

Muting a track silences every clip on it. Audio persists in .motion, plays during preview, and is mixed into MP4 and WebM export.

The single audio "..." { start } node from earlier versions still loads. The editor converts it to an import plus a clip the first time the project is opened, so no manual migration is needed.

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 tracks sort below the visual ones, and a project may declare as many of them as it needs.

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.

Themes and archetypes

New generated projects can declare a theme once and compose scenes with archetype blocks. Archetypes own layout, while titles, media aliases, effects, and timing remain editable source. Existing coordinate-based projects continue to parse unchanged.

theme {
  background #050608
  text #EDF0F4
  accent #7CF7C5
  displayFont "Space Grotesk, Inter, sans-serif"
}

archetype launch {
  type hero
  title "Make it move."
  media product
  duration 5s
  effects "meshGradient > grain > vignette"
}