The layers array of the animation
or of a precomposition lists layers top first. Layer types 0 to 4 are in the Lottie
specification; the others, and keys marked “docs”, are described by Lottie Docs.
Animated values use the property objects described on the animation page.
Layer types
ty | Layer | Own keys |
|---|---|---|
| 0 | Precomposition | refId (the precomposition asset), w and h (clipping size), tm (time remap: a scalar mapping layer time to precomposition time in seconds). |
| 1 | Solid | sw, sh (size), sc (hex colour). |
| 2 | Image | refId (the image asset). |
| 3 | Null | None; used as a parent to move other layers. |
| 4 | Shape | shapes: the shape elements. |
| 5 | Text | docs: t, the text data, below. |
| 6 | Audio | docs: au (audio settings) and refId. |
| 13 | Camera | docs: pe (perspective) and a transform; for 3D animations. |
| 15 | Data | docs: refId to a data asset. |
Common keys
| Key | Type | Meaning |
|---|---|---|
nm | string | Name. |
ty | integer | Layer type. |
ind | integer | Index, used for parenting, mattes and expressions. |
parent | integer | The ind of the parent layer. The child’s matrix is the parent’s matrix times its own; opacity is not inherited. |
ip, op | number | The frames at which the layer appears and disappears. |
st | number | Start time offset of the layer’s content. |
sr | number | Time stretch: below 1 plays faster, above 1 slower. Applied before tm. |
hd | boolean | Hidden: not drawn, but it still works as a parent and as a matte. |
ks | transform | The layer transform, below. |
ao | 0 or 1 | Auto-orient: rotate to follow the direction of an animated position. |
tt | integer | Track matte mode, below. |
tp | integer | The ind of the matte layer; when absent, the layer above. |
td | 0 or 1 | docs: this layer is used as a matte. |
masksProperties | array | Masks, below. |
hasMask | boolean | docs: whether masks are present. |
bm | integer | docs: blend mode, below. |
ddd | 0 or 1 | docs: 3D layer, using rx, ry, rz and or in the transform. |
ef | array | docs: After Effects effects. |
cl, ln, tg | string | docs: CSS class, HTML id and tag name for players that render to HTML or SVG. |
ct | 0 or 1 | docs: collapse transform. |
mb | boolean | docs: motion blur. |
Transform
| Key | Type | Meaning |
|---|---|---|
a | position | Anchor point, the centre of scaling and rotation. |
p | splittable position | Position. |
s | vector | Scale in percent; [100, 100] is unscaled. |
r | scalar | Rotation in degrees, clockwise. |
o | scalar | Opacity, 0 to 100. |
sk | scalar | Skew angle in degrees. |
sa | scalar | Skew axis in degrees: 0 the x axis, 90 the y axis. |
rx, ry, rz, or | scalar, vector | docs: 3D rotations and orientation. |
The matrix is built in this order: translate by −a; scale by
s/100; if sk is not 0, rotate by −sa, skew x by
tan(−sk) and rotate by sa; rotate by −r; translate
by p.
Masks
| Key | Meaning |
|---|---|
nm | Name. |
mode | Mask mode, below. |
pt | The mask outline, an animated Bézier path. |
o | Opacity, 0 to 100. |
inv | Inverted. |
x | docs: expansion, which grows or shrinks the mask. |
mode | Meaning |
|---|---|
n | None. |
a | Add. |
s | Subtract. |
i | Intersect. |
l | docs: Lighten. |
d | docs: Darken. |
f | docs: Difference. |
Track mattes
tt | Matte |
|---|---|
| 0 | Normal (no matte). |
| 1 | Alpha: the matte layer’s alpha. |
| 2 | Inverted alpha. |
| 3 | Luma: the matte layer’s luminance. |
| 4 | Inverted luma. |
Blend modes
bm | Mode | bm | Mode |
|---|---|---|---|
| 0 | Normal | 9 | Soft light |
| 1 | Multiply | 10 | Difference |
| 2 | Screen | 11 | Exclusion |
| 3 | Overlay | 12 | Hue |
| 4 | Darken | 13 | Saturation |
| 5 | Lighten | 14 | Colour |
| 6 | Colour dodge | 15 | Luminosity |
| 7 | Colour burn | 16 | Add |
| 8 | Hard light | 17 | Hard mix |
Text layers (docs)
A text layer’s t object has four parts:
| Key | Meaning |
|---|---|
d | The text document: always keyframed, and changes in steps. Each keyframe’s s holds the document below. |
a | Text ranges: each has a selector s (which characters, by start, end and offset, in percent or index units, grouped and shaped as below) and a style a (transform, opacity, fill, stroke and tracking for those characters). |
m | Alignment options: a the grouping alignment and g the anchor grouping. |
p | Follow path: places the text along a mask path. |
| Document key | Meaning |
|---|---|
t | The text; line breaks are \r. |
f | Font name, matching fName in fonts.list. |
s | Font size. |
fc, sc | Fill and stroke colours. |
sw | Stroke width. |
of | Stroke drawn over the fill. |
j | Justification, below. |
tr | Tracking. |
lh | Line height. |
ls | Baseline shift. |
sz, ps | Size and position of a text box, for paragraph text. |
ca | Capitals, below. |
| Enumeration | Values |
|---|---|
Justify (j) | 0 left, 1 right, 2 centre, 3 justify with last line left, 4 last line right, 5 last line centre, 6 last line full. |
Caps (ca) | 0 regular, 1 all caps, 2 small caps. |
| Grouping | 1 characters, 2 words, 3 lines, 4 all. |
| Based on | 1 characters, 2 characters excluding spaces, 3 words, 4 lines. |
| Range units | 1 percent, 2 index. |
| Range shape | 1 square, 2 ramp up, 3 ramp down, 4 triangle, 5 round, 6 smooth. |
| Font origin | 0 local, 1 CSS URL, 2 script URL, 3 font URL. |
Each entry of fonts.list has fName, fFamily,
fStyle, fWeight, fPath and origin.
Each entry of chars has the character ch, its
fFamily, style, size, advance width
w and its outline in data.