Reordering, duplicating and deleting elements

The canvas is used for the live design view, selecting or reordering elements, and editing text. Restructuring a page happens in two places: the hover bar on the canvas, and the Elements Tree.

From the indicator hover bar

Hover an element and a small bar appears above it, giving quick actions on that element.

On the right side of the bar you can duplicate the element or remove it. Depending on what kind of element it is, you may also be able to replace the image, edit the text, or modify the grid configuration.

The left part of the bar is a dropdown listing the element’s parents — handy when you need to select one of its containers and there’s no gap to click it normally.

Full detail in the indicator hover bar.

From the Elements Tree

Elements can also be selected and moved to other positions from the Elements Tree. When you select one there, the canvas scrolls automatically to its position.

To move an element or element group, click and drag. While dragging, a grey indicator bar represents where the element will be placed when dropped.

Copy, paste and duplicate

All the duplicate, copy and paste functions work when an element is selected in the tree:

Select the element you want to copy and press ⌘C / Ctrl+C , then select the element where you want it and press ⌘V / Ctrl+V . The right-click menu offers the same commands.