This article covers all the controls for arranging and styling elements on a page — grouping, auto-arranging multiple images (magic wand), layering, flipping, locking, the colour picker, and opacity. Most of these work on every element type (text, images, shapes, pins, and groups); opacity is currently only available on shapes.
How to group and ungroup elements
Grouping lets you treat multiple elements as a single unit — useful when you've laid out several pieces (a product image with a label, or a row of pinned products) and want to move them together.
How to group elements
Select multiple elements — Shift + click each one, or drag a marquee around them.
Right-click → Group, or press Cmd + G (Mac) / Ctrl + G (Windows).
The group now moves, resizes, copies, and pastes as a single unit.
How to ungroup elements
Right-click the group → Ungroup, or press Cmd + Shift + G (Mac) / Ctrl + Shift + G (Windows).
How to bring something to the front or send it to the back (layering)
Z-order — also called layering — controls which elements sit in front of which when they overlap.
With one or more elements selected, right-click to access:
Bring to front — moves the element above everything else. Shortcut:
].Send to back — moves it behind everything else. Shortcut:
[.
💡 Tip — for floor-plan layouts, lock the floor plan as the bottom layer, then build pins, text, and shapes on top. Z-order keeps the visual hierarchy clear.
How to flip an element horizontally or vertically
Flipping mirrors an image, shape, or group.
Right-click → Flip horizontal (mirrors left-to-right). Shortcut: Shift + H.
Right-click → Flip vertical (mirrors top-to-bottom). Shortcut: Shift + V.
How to lock an element in place
Locking stops an element from being accidentally moved or resized — useful for floor plans, background images, or anything you've placed exactly where you want it. Locking works on any element: text, image, shape, pin, or group.
Three ways to lock:
Click the element to select it, then click the lock icon in the toolbar.
Right-click the element → Lock.
Press Shift + Cmd + L (Mac) / Shift + Ctrl + L (Windows).
Unlock any of the same ways.
How to use the colour picker (eyedropper)
The colour picker lets you sample any colour from the page — an image, a shape, a piece of text — and apply it to whatever you're styling. So if you want a shape to match the navy in one of your renders, you can lift the exact colour without guessing the hex code.
Select the element you want to apply the colour to.
Open its colour picker (e.g. shape fill, text colour, page background colour).
Click the eyedropper icon.
Click the colour you want to sample anywhere on the page.
The sampled colour is applied to your element straight away.
How to change opacity (transparency)
You can adjust the opacity of a shape — that is, how see-through it is — from its toolbar. Type a percentage from 0 to 100 in the opacity field.
100% = fully opaque (the default for new shapes).
0% = fully transparent (invisible).
When opacity is useful
A semi-transparent rectangle placed behind text — keeps the text readable when it sits over a busy image.
A coloured shape over part of an image or render to highlight or de-emphasise an area.
Need more help? Contact our support team via live chat for personalized assistance.