Create a component
Turn layers into a reusable component. Every instance follows edits to the original.
A component is a part you build once and reuse: a list row, a card, a particle, a button. Each copy, called an instance, has its own start time, speed and play mode, and every instance follows when you edit the component. Components keep big scenes small and consistent, and they export as real components to React and SwiftUI.
Make one
- Select the layers (or a group) that make up the part.
- Press ⌥⌘K, or choose Stage → Create Component, or click Create component in the selection bar. In the timeline, right-click a lane → Create Component (or Create Component from 3 Layers).
- The layers become a component, and one instance takes their place. Timing is kept: the instance starts at the first keyframe. A notice says “Row is a component now — double-click it to edit every copy”.
- Duplicate the instance (⌘D) or place more from the library.
A single plain layer names the component after itself; a group keeps its own name. Instances are marked in magenta (on the stage, in the timeline and in the inspector), so you can tell them apart from plain layers at a glance.
Component or group?
| Group | Component | |
|---|---|---|
| Copies | Independent; editing one doesn't change others | Every instance follows the component |
| Timing | Children use scene time | Each instance has its own clock (start, speed, play mode) |
| Per-copy differences | Anything | Props and variants |
| Exports | Flattened | React and SwiftUI components, Lottie precomps |
Detach an instance
Stage → Detach Instance (also in the selection bar's instance menu and the lane menu) turns an instance back into plain layers, with its timing baked in. The component stays in the library.
Works with
Troubleshooting
| If this happens | Try this |
|---|---|
| “Select the layers to turn into a component” | Nothing is selected. Select layers on the stage or in the timeline first. |
| The instance jumped in time | It starts at the first keyframe of the selection. Set Start in the Instance section. |