Layers add structure and organisation to your diagrams. When you interact with a complex diagram, to display or hide its various layers, you can understand them more easily.

Note: Each shape or connector (or group) can only be placed on one layer - it can’t belong to multiple layers.

Using layers in diagrams

The sections below explain how to work with layers in draw.io.

• Using layers in diagrams
  • Open the Layers dialog
  • Add a new layer
  • Rename a layer
  • Remove a layer
• Work with shapes on layers
  • Add shapes to a layer
  • Move shapes to another layer
  • See which layer a shape belongs to
  • Rearrange layers to move shapes forward or backward
• Hide or display layers
• Lock layers to prevent changes
• Diagrams that work well with layers

Open the Layers dialog

Select View > Layers or press Ctrl+Shift+L / Cmd+Shift+L to display or hide the Layers dialog.

By default, a new diagram has a single Background layer, to which all shapes, connectors and text are added.

From the Layers dialog, you can add new layers and rename them, select which layer to add new shapes to, remove existing layers, and move selected shapes to a layer.

You can also display and hide layers, which will display or hide all of the shapes, connectors and text that are on those layers.

Finally, locking a layer makes sure you can’t make any inadvertent changes.

Add a new layer

At the bottom of the Layers dialog, click on Add Layer (+).

Your new layer will be automatically selected (with a blue background), and any new shapes you add to the drawing canvas will be placed on your new layer.

Duplicate a layer: Select the layer you want to duplicate, then click on Duplicate in the Layers dialog (a + in a box with a shadow).

Back to top

Rename a layer

When you add a new layer, it will be given a default name. Double click on the layer, enter its new name, then click Rename to name it something more meaningful.

Rename a layer via its metadata

Layers have metadata, just like shapes have metadata. This metadata allowed advanced functionality within your You can also change a layer’s name via the Edit Data dialog.

See how to use metadata and placeholders in labels and tooltips

1. Select a layer, then click on the Edit Data in the Layers dialog (three vertical dots).
   
2. Change the text in the Label field and click Apply to change the layer’s name.
   

Back to top

Remove a layer

Remove a layer will delete all of the shapes and connectors that are on it as well as the layer itself. Click on a layer to select it, then click on Remove in the bottom left of the Layers dialog (rubbish bin) to remove the layer and its shapes.

Note: Your diagram must have at least one layer for shapes and connectors to be placed. If there is only one layer in your diagram, you can not delete it.

Back to top

Work with shapes on layers

Shapes are arranged in the order you added them to the drawing canvas, within the layer you added them.

Layers are arranged from front to back as they are ordered in the Layers dialog. Shapes and connectors placed on a higher layer can not go back behind shapes on a lower layer - they can only be arranged from front to back within their layer.

Add shapes to a layer

1. Make sure your layer is unlocked before you make changes (click on the lock/unlock icon to the left of the layer name). Layers are unlocked by default.
2. Select the layer you want to add the shapes to in the Layers dialog, then add the shapes to the drawing canvas.

Back to top

Move shapes to another layer

1. Select the shapes, connectors and text you want to move to another layer.
2. In the layers dialog, click on the Move selection to icon (a box with an arrow going into it vertically), then select the layer you want to move it to.

Back to top

See which layer a shape belongs to

1. Select one shape or a single group of shapes - this does not work when you select multiple shapes, as they may be on multiple layers.
2. Click on Move selection to in the Layers dialog. The layer with the check mark next to it is the layer that the shape is on.

Back to top

Rearrange layers to move shapes forward or backward

To move one layer’s shapes in front of another, you need to change the order of the layers in the Layers dialog. Layers are arranged from top to bottom (front to back on the drawing canvas).

Learn how the z-order of shapes positions them in front of or behind other shapes

Click and drag a layer in the Layers dialog to place its shapes in front of or behind another layer.

Note: When you move shapes to a layer, they are placed in front of any existing shapes on that layer, just like when you add new shapes to a layer.

Back to top

Hide or display layers

To understand complex diagrams that use layers, you can display and hide layers.

In the Layers dialog, a check mark next to the layer’s name indicates it is visible. Click on this checkbox to hide the layer, or display it if it was previously hidden.

Hide or display layers in the diagram viewer: Click on the Layers tool at the bottom of the diagram viewer, then click on the checkboxes next to the layer names to hide or display the layers. This tool is not available if the diagram only has one layer.

Tip: Use custom links to make your diagram interactive and toggle layers on and off when you click on a shape within the diagram.

Back to top

Lock layers to prevent changes

Locking a layer means you cannot make any changes to it - you can’t add, move, edit, stye or delete the shapes and connectors placed on that layer.

In the Layers dialog, click on the padlock icon to the left of the layer’s name that you want to lock.

Back to top

Diagrams that work well with layers

• Floor plans - Add furniture, appliances or IT devices, fixtures, and decorations on separate layers.
• Network diagrams - Place areas behind firewalls or on different subnets on different layers.
• Gitflow diagrams - Separate team or feature branches onto their own layers. Open the example gitflow diagram with layers in our diagrams viewer