Important links

Related articles

Layers Panel

Located on the left, the layers panel contains both pages and artboards with all layers. You can view each layer attribute (such as hidden, locked, masked), or rename and organize layers.

Pages

In Studio, you can organize your designs in multiple pages. The layer list will display the layers of the selected page only. To see the page list (if you've created multiple pages), click the Pages tab at the top of the layers panel. To insert a new page, click the add button (+) at the top right of the layer list. To rename a page, double click the current page name.

Artboards

Artboards in the layer list contain only the layers inside the artboard. Artboard layers are at the top of the hierarchy and cannot be contained within another artboard. Just as you can with individual layers, you can use the name to find a specific artboard via the Filter Layers field in the layers panel.

Libraries

The Libraries list in the layers panel lets you access components from either your document library or a shared library. You can use the name or part of the name to find a specific component via the Filter Components field directly below your list of libraries.

Masks

A small arrow icon shows you when a layer is masked. The mask layer has a small eclipse icon. Any shape can be turned into a mask. To create a mask, select the shape and click on the mask (small eclipse) icon in the toolbar. Alternatively, select the shape then right click and select Mask.

Toolbar maskMask and masked layers

Hiding and locking layers

All layer types can be hidden and unhidden by clicking the eye icon that shows on hovering the layer in the layer list. A hidden layer will become grey and have the eye icon on the right. To lock any layer, press ALT while hovering over the layer list and click the lock icon that appears.

In Studio, you can also lock artboards. Locking an artboard will lock all layers from being selected on canvas. Locked artboards can be moved around on canvas. Locked layers can be selected from the layer list only.

Hide icon on hoverHidden layerHold Alt/Option key to see lock icon

Interaction

If a layer has an interaction, it will be marked with the small lightning icon in the layer list. Any type of layer (including artboards) can have interactions. Each interaction has a trigger type, transition type, and one target. For more detailed transition, choose Motion which allows you to customize delay, duration and curve.

Layers with interactionInspector panelMotion

Boolean operations

Combined shapes are created using boolean operations. They are marked in the layer list with a small icon of a circle with a rectangle on top.

Selection

Hovering a layer in the list or on the canvas will highlight a layer with a blue outline. Selected layers have a blue background in the layer list and bounding box around the layer on canvas. You can select one ore more layers at a time.