---
title: "Animating"
description: "Set poses, shape the movement between them, and arrange when each layer plays."
canonical: "https://terminal.lottiefiles.com/docs/animating/"
last_updated: 2026-10-29
---

# Animating

Set poses, shape the movement between them, and arrange when each layer plays.

You edit values in the rail (the Properties panel in After Effects or Figma), keys in the
score (the timeline), and the route of a move on the stage. A **key** stores a value at a
frame. A **move** is the stretch between two keys.

Watch: [Your first keys](https://terminal.lottiefiles.com/first-keys/),
[Retime on the score](https://terminal.lottiefiles.com/retime/).

## The playhead and playback

Click or drag along the ruler to scrub. The stage and the rail show that frame.
The time under the stage shows the current time and the document's duration in seconds.

| Key or control | Action |
|---|---|
| `space`, or the play button | Play or pause; playback repeats the document or the work area |
| `0` / `Home` | Go to the first frame |
| `$` / `End` | Go to the last frame |
| `h` `l` / `←` `→` | Go back or forward one frame while the score has the keys |
| `⇧H` `⇧L` | Go back or forward ten frames |
| `PgUp` `PgDn`, or `⌃←` `⌃→` (`⌘` too) | Step one frame; hold `⇧` for ten |
| `j` `k`, or the previous/next key buttons | Go to the previous or next key on the selected row; the buttons' hints name `j` and `k` |
| **Go to frame** in the palette | Type a frame such as `48`, or a time such as `1.5 s` |

The palette (`:`) also accepts a frame or time directly. On the stage, plain arrows nudge a
layer instead; `esc` gives the keys back to the score. See [Keys](https://terminal.lottiefiles.com/docs/keys.md) for platform notation.

### Preview

Press `` ` `` or `⌘\`, click the preview button under the stage, or choose **Preview, full
screen** in the palette or **View** menu. The animation fills the screen without the editor.
Click the picture or press `space` to play or pause. Drag across it to scrub and stay paused.
`←` `→` step a frame (`⇧` for ten), `0` returns to the start, and `$` goes to the last frame.
`g` changes the preview background; `⇧M` mutes or unmutes sound. `esc`, `q` or `` ` ``
returns to editing. Move the pointer to bring the bottom line back into view.
To test a state machine and its inputs,
use [Try it](https://terminal.lottiefiles.com/docs/states.md) instead.

## The score

The ruler runs in seconds. A layer's rows show its animated properties, with diamonds for
keys and a speed band between them. A higher band means a faster change. The first row also
shows the layer's span: the time during which it appears.

| Part | What you can do |
|---|---|
| Layer name | Click to fold or unfold its properties; `enter` folds or unfolds the selected layer |
| Property row | Click to select it; `↑` `↓` step through rows |
| Key | Click to select it and open its ease box; drag to change its time |
| Move between keys | Click for its ease box; drag the selected move to shift both keys; double-click to loop it |
| Eye and lock beside a layer | Hide or lock it; the controls appear on hover or while enabled |
| **≈** beside a property | A [behaviour](https://terminal.lottiefiles.com/docs/behaviours.md) drives it; a faint trace shows the result |
| Indented rows | Layers inside a precomp, parent or repeat |
| Marker lane under the ruler | Drag empty lane to make a marker, its ends to resize, its body to move; double-click to loop |
| Sound and video lanes | Waveforms and filmstrips; see [Layers](https://terminal.lottiefiles.com/docs/layers.md) |

Drag the border above the score upwards for more room. `⌥`-scroll, or scroll on the ruler,
zooms time about the pointer. Swipe sideways to pan. `=` zooms in, `-` zooms out, and `\`
or **Show the whole score** fits the full duration again.

## Add and change keys

Select a layer, put the playhead at the first pose and press the property's key below.
Move the playhead, then change the value in the rail or move the layer on the stage.
Once the property animates, each edit makes or changes its key at the playhead.

| Property | Key it and show its track | Add or remove its key here |
|---|---|---|
| **Position** | `p` | `⌥⇧P` |
| **Scale** | `s` | `⌥⇧S` |
| **Rotation** | `r` | `⌥⇧R` |
| **Opacity** | `t` | `⌥⇧T` |
| **Anchor** | `⇧A` | `⌥⇧A` |
| **Fill** | `f` | `⌥⇧F` |

For other properties, use the marker beside the rail's value. **◆** means a key is here,
**◇** means it animates but has no key here, and **·** means it is still. Clicking the marker
adds or removes a key. Click a value to type it, or drag its number sideways (`⇧` moves ten
times as far, `⌥` a tenth).

While typing in the rail, `tab` keeps the value and moves to the next field; `⇧tab` goes to
the previous one. See [The rail's values](https://terminal.lottiefiles.com/docs/editing.md#the-rails-values).

`i` adds a key on the selected track, keeping the value at that frame. `x` or `delete`
removes selected keys. A track left with one key stops animating. `u` undoes and `⇧U` redoes.

### Move and select keys

Drag a key to retime it. It snaps to the playhead and other keys. `,` and `.` nudge selected
keys one frame earlier or later; `<` and `>` nudge ten. `⌥←` `⌥→` do the same, with `⇧`
for ten frames. The bottom line reads out the change.

Drag a box from empty track or a move that isn't selected to pick the keys inside it.
Over a folded layer's row, the box picks its tracks' keys. They turn gold. With `⇧` the box
turns each key inside instead: a picked one is let go, the rest join what's picked; `⇧`-click
(or Ctrl-click) does the same one key at a time.

Drag a picked key, including one on a folded row, or the move between two picked keys to
move them all by the same number of frames. Nudge, delete and ease commands act on the
selection. `esc` lets go. A click on empty track moves the playhead and clears the picks;
a click on a move selects it and opens its ease box. Drag the ruler to scrub.

### Copy and paste keys

With keys picked, press `⌃C` to copy or `⌃X` to cut. Put the playhead where the first pasted
key should go and press `⌃V`. Their spacing stays the same. A single selected key copies too
while the score has the keys. Clicking a layer name or focusing the stage makes these commands
copy the layer instead.

Keys paste onto their original properties. In another document, or if the original layer is
gone, they paste onto matching properties of selected layers. An existing key at the pasted
frame gives way; other keys stay. Keys past the document's end are omitted, except the last,
which lands at the end.
Bake a driven layer's [behaviours](https://terminal.lottiefiles.com/docs/behaviours.md#stack-compare-remove-and-bake) before pasting keys onto it.

## Move or trim a layer in time

The first row of a layer has a grip at either end of its span and **≡** in the middle.
Drag **≡** to move the whole layer, keys included. Drag an end to trim when it appears,
leaving the motion in place. These actions apply to selected layers together as one undo step.
A key in the same cell takes precedence over a grip.

| Key or palette command | Result |
|---|---|
| `[` / **Move the layer to start at the playhead** | Move its first visible frame here, keys too |
| `]` / **Move the layer to end at the playhead** | Move its last visible frame here, keys too |
| **Trim the layer's start to the playhead** | Change its first visible frame without moving keys |
| **Trim the layer's end to the playhead** | Change its last visible frame without moving keys |

A span retains at least one frame. Its moving end snaps to the playhead, markers and keys.
Moving and trimming spans require a local file; save a file copy of a Creator document first.

## The ease box

Click a key or a move to open the ease box beside it. It names the property, start and end
times, duration in milliseconds, and the two values. The ease belongs to the move starting
at that key. A hold key has nothing to ease.

Rest the pointer on a preset to try it: the stage loops the move and a dashed curve shows
the proposed ease. Click to keep it. Moving away leaves the original ease. Driven rows and
behaviour controls cannot audition eases; apply one and undo to compare.

| Key | Preset | Change in speed |
|---|---|---|
| `1` | **linear** | Constant |
| `2` | **ease** | Starts gently and settles |
| `3` | **in** | Starts slowly |
| `4` | **out** | Finishes slowly |
| `5` | **in-out** | Starts and finishes slowly |
| `6` | **expo-out** | Moves quickly at first, then settles over a long tail |
| `7` | **back-out** | Goes past the end, then returns |
| `8` | **anticipate** | Moves back before leaving, then overshoots the end |
| `9` | **snap** | A brief slow start followed by a quick arrival |

![The ease box with nine presets, a curve, cubic-bezier values and graph and loop controls](https://terminal.lottiefiles.com/docs/assets/shots/animate-ease.png)

Drag either curve handle to change the ease. `tab` selects a handle for arrow-key editing;
`⇧` makes finer steps, and `tab` switches handles. `esc` leaves the handles. The
**cubic-bezier(…)** readout gives the curve's four values for use in CSS.

**all … moves**, or `a`, copies this ease to every move on the track. **loop**, or `o`,
loops the selected move with a little time either side. **graph** opens the graph editor.

`F9` applies **Easy ease** to the selected keys, `⇧F9` **Easy ease in**, and `⌃⇧F9`
(`⌘⇧F9` too) **Easy ease out**. `⌃⌥H` (`⌘⌥H` too) toggles hold: the value stays unchanged
until the next key, then jumps.

When asking the [copilot](https://terminal.lottiefiles.com/docs/copilot.md) for an ease, you can also name **sine**, **quad**,
**cubic**, **quart**, **quint**, **expo**, **circ** or **back**, each with **in**, **out** or
**in-out** (for example, `cubic-out` or `easeInOutQuad`). A family name alone means out.
GSAP names such as `power2.out` work too. These names give curves; you can keep shaping
their handles after applying them.

Watch: [Shape the ease](https://terminal.lottiefiles.com/shape-the-ease/).

## The graph editor

Double-click a property's name in the score, choose **Graph editor** in the palette, or
click **graph** in the ease box. It replaces the score with values over time. A track needs
at least two numeric keys; shape paths cannot be drawn as value curves.

Time goes left to right. Height is the value, not a place on the stage. **Position**'s **x**
curve rises when the layer moves right; its **y** curve rises when it moves down. Click **x**,
**y** or **z** to choose a dimension. Colours show **r**, **g**, **b**, **a**.

Drag a large key to change its time and value, between its neighbours. Drag a smaller handle
to shape the change. A key's two handles stay in line; `⌥` moves one alone. A handle normally
eases only its dimension. Curved motion paths, colours and Creator documents ease dimensions
together; the header says **eased as one** where applicable.

The graph fits the selected dimension. It stays still during a drag; click its name to refit,
or change dimension or track. Drag the border above it to enlarge it. `esc` closes it.

![Position's x curve in the enlarged graph editor, with its start handle flattened](https://terminal.lottiefiles.com/docs/assets/shots/animate-graph.png)

Watch: [The graph editor](https://terminal.lottiefiles.com/graph-editor/).
See [Graphs, paths and spacing](https://terminal.lottiefiles.com/docs/concepts/graphs-paths-and-spacing.md).

## Motion paths

Select a moving layer to see its route on the stage. Diamonds are keys; dots mark frames.
Dots bunch up where it moves slowly and spread out where it moves quickly.

| Action | Result |
|---|---|
| Drag a diamond | Move that position key in space |
| Drag a selected key's handle | Bend the route; the opposite handle turns with it |
| `⌥`-drag a handle | Move that handle alone |
| Drag a dashed handle on a straight move | Make the route curved |
| Double-click a diamond | Straighten its path handles |
| Click a stretch of path | Open that move's ease box |
| `m` | Show or hide every moving layer's path, faintly |

### Motion sketch

Select one layer and choose **Motion sketch** in the palette. Press on the stage and drag:
playback starts from the playhead and the selected layer follows your movement. Release to
turn the take into smooth Position keys, with the pace you drew. Recording also stops at
the document's end or the work area's last frame.

The take replaces keys over the recorded interval as one undo step. `esc` cancels and restores
the layer; other keys do nothing while recording. If the playhead is outside the work area or
at its end, recording starts at its beginning. Position must be joined, rather than split
into X and Y. Bake or remove a behaviour driving Position before recording.

## Onion skin

Choose **Onion skin** in the palette or **View › Onion skin › Show onion skin** to outline
nearby frames. Earlier frames are red, later frames green; more distant ones are fainter.
Only changed parts are outlined. It shows while paused and returns after you release a drag.
It does not show in Preview or on a stage drawn in characters. It never changes an export.

![A curved motion path with two earlier poses outlined red and two later poses green](https://terminal.lottiefiles.com/docs/assets/shots/animate-onion.png)

| Menu row | Values |
|---|---|
| **Show onion skin** | On or off |
| **Frames behind** | 0–4; starts at 2 |
| **Frames in front** | 0–4; starts at 2 |
| **Spacing** | 1–12 frames; 0 chooses about a twelfth of a second (3 frames at 30 fps) |

In the submenu, `←` `→` or **‹** **›** step a value; a digit sets it. `esc` returns to
**View**, as does `←` on the first row. Values dim while off. The palette also offers
**Onion skin: one more frame behind**, **Onion skin: one more frame in front** and
**Onion skin: spacing**; each cycles its value. These settings apply to all open documents
and reset, with onion skin off, when you restart.

Watch: [Motion paths and onion skin](https://terminal.lottiefiles.com/motion-paths/).

## Animation presets

**Apply preset** in the palette lists your presets first, then **Pop in**, **Slide up**,
**Bounce**, **Fade out** and **Wiggle**. Select layers, place the playhead and choose a preset.
`⏎` applies it from that frame. With several layers selected, add a number after its name
(`slide up 5`) to start each layer five frames after the previous one.

Position moves are measured in pixels from each layer's own position. **Slide up** starts
40 px below it, regardless of size. Scale and opacity are relative: a pop on a layer at
50% scale ends at 50%. Keys within the preset's interval replace that property's keys;
keys before and after stay. Applied keys and behaviours belong to each layer and remain editable.

Choose **Save animation as preset** in the palette or the layer's right-click menu, then type
a name. It saves Position, Scale, Rotation and Opacity keys and eases, behaviours on those
properties, and Animate text. It starts at the animation's beginning. Saving the same name
replaces it. Follow, Aim and Near stay with their source layer rather than entering the preset,
and so do a rig's Pose and IK.

Split Position cannot be saved as a preset, though a preset can apply to it. Bake a target
layer's existing behaviours before applying preset keys. Presets live in
`~/.config/motion/presets`, one JSON file each. Copy a file
to share it; it is separate from the document. Unreadable presets are omitted with a reason.

Watch: [Animation presets and stagger](https://terminal.lottiefiles.com/presets-stagger/).

## Work areas and seamless loops

`b` sets the work area's start at the playhead; `n` sets its end. Playback repeats that
interval. `o`, or double-clicking a move, loops the move with a little time either side.
Press `o` again or choose **Stop the loop** to return to the whole animation.

**Make the animation loop seamlessly** in the palette is a setting of the document: eligible
animated properties play back to their starting value by the end frame, as if a key were
there, eased as the move before it. The score shows only your keys. The ending follows the
start and the document's length as you edit, and exports carry it as an ordinary key.
This applies to numeric keys in the main composition, with at least two keys before the end
and all keys within the document. It leaves shape paths, nested keys, behaviours and rigs alone.
An ending you have set yourself, such as a full 360° turn, stays yours. This joins the
values at the seam, the move back eased as the move before it. To shape that move yourself,
key the end frame at the starting value: that key is yours, eased like any other.

**Stop looping seamlessly** turns the setting off: each property plays its own keys. Undo restores
the previous document. To repeat one property's keys within its layer's span, use the
[Loop behaviour](https://terminal.lottiefiles.com/docs/behaviours.md#motion-of-its-own). See [The three kinds of loop](https://terminal.lottiefiles.com/docs/concepts/animation-loops.md).

## Skeleton mode

Press `y` (`⌘Y` too), or choose **Skeleton** in the palette or **View** menu. The stage draws
shapes as thin outlines without fills, mattes or masks, so hidden geometry shows through.
Selection still works. Press it again to return. It changes only the editor's stage,
applies across open documents, and starts off each time you open Creator Terminal.

## Precomps and their time

A precomp is a composition held in a layer. Select layers and press `⌃G` to group them into
one. Animate the container to move, scale or rotate them together. Double-click on the stage,
or press `enter` with the stage focused, to select inside it. `⇧⏎` or `⌥⏎` selects the
container again. The rail names the composition holding the selected layer.

The score shows nested keys at the main playhead's time. A precomp whose own time starts at
zero can begin one second into its parent. Going inside does not reset the playhead. Moving
the container's span shifts the scene and its keys on the main score; trimming its span
changes when the scene is visible and leaves its inner motion intact. Imported time stretch
also affects where nested keys appear on the score.

Watch: [Precomps and their time](https://terminal.lottiefiles.com/precomps/).

## Tasks

- [Make a layer move between two poses](https://terminal.lottiefiles.com/docs/how-to/animate-between-poses.md)
- [Slow a move without changing its route](https://terminal.lottiefiles.com/docs/how-to/slow-a-move.md)
- [Bend a move into an arc](https://terminal.lottiefiles.com/docs/how-to/bend-a-motion-path.md)
- [Make a bell wiggle](https://terminal.lottiefiles.com/docs/how-to/wiggle-a-bell.md)
- [Make a row of delayed copies](https://terminal.lottiefiles.com/docs/how-to/stagger-linked-copies.md)