Make and edit a component

A component is a layer you design once and reuse: a button, a card, a header. Each copy on your pages is an instance. Change the component, and every instance changes with it.

Make a component

1. Select the layer: a frame or a stack with what it holds.
2. Right-click it and choose Create component (⌘⌥K, Ctrl+Alt+K on Windows), or find it with ⌘K.
3. Type the component's name in the field below the layer and press Enter.

The layer stays where it was, now as an instance of the new component. When other layers on the page are built the same way, Make component from similar layers makes them instances too, in one step.

To use it elsewhere, open Assets: under Components, a click inserts an instance next to your selection, and a drag puts it where the indicator shows.

Change it everywhere

1. Select an instance and choose Edit component (⌘⌥E), or Edit component in the component's menu in Assets.
2. The component's master opens on its own, and the top bar shows the page and the component.
3. Change it as any layer: every instance on every page follows.
4. Click the page's name in the top bar, or press Esc with nothing selected, to go back.

What an instance changed on its own keeps its own value. The article Components covers variants, properties and changes inside one instance.

Stop using the component

Detach instance (⌘⌥B) turns the selected instance back into ordinary layers: they no longer follow the component.