The Properties Panel
The Properties panel is the 320 px column on the right side of the Designer. Its content changes depending on what is selected on the canvas.
States
Section titled “States”Nothing selected — Canvas settings
Section titled “Nothing selected — Canvas settings”When the canvas is empty or you click an empty area, the panel shows Canvas settings: size preset, dimensions, output intent (Screen or Print, with unit and DPI for Print), and background. See Setting Up the Canvas.
Single element selected
Section titled “Single element selected”The panel shows the element header and, below it, all of the element’s settings as one scrolling list of collapsible sections. There are no tabs. Which sections appear depends on the element:
| Section | Appears for | Contents |
|---|---|---|
| Variable | Text, Image, QR Code, Barcode | Use as variable toggle; once it is on, the variable’s name, default and other settings |
| Text | Text elements | The text content box |
| Typography | Text elements | Font, Auto-Fit, Style, Spacing, Color |
| Position & Size | All elements | X / Y, width and height, rotation, flip |
| Appearance | All elements | Fill, border, opacity, corner radius, and the element-specific controls (QR code, barcode, image, icon, line/arrow, triangle, curved rectangle) |
| Shadow | All elements | Color, blur, offset (collapsed by default) |
| Arrange | All elements | Layer order buttons, canvas alignment buttons |
Click a section’s title to collapse or expand it. The panel remembers which sections you collapsed as you move from one element to another.
Multiple elements selected
Section titled “Multiple elements selected”The panel header reads “N Elements” with a clear-selection (✕) button. Below it are the Align, Distribute, Align to Canvas and Match Size controls, and a Group Selection button.
Group selected
Section titled “Group selected”The panel shows the group’s name and member count, a Group Properties section with Name and Opacity, and an Ungroup Elements button.
Element header
Section titled “Element header”When a single element is selected, the panel header shows:
- Element icon (type indicator)
- Element name (first ~24 characters of text content, or element type)
- Variable badge (
{{variableName}}) if the element is variable-bound - Type and size in the sub-line (e.g. “text · 400×80”)
- Hide/Show (eye) and Lock/Unlock buttons; the lock icon turns amber while the element is locked
- More actions (⋮) menu with Duplicate and Delete
- Close button (X — deselects)
Where each section is documented
Section titled “Where each section is documented”| Section | Page |
|---|---|
| Variable | Creating a Variable, Variable Settings |
| Text, Typography | Text & Typography |
| Position & Size | Adding & Selecting Elements |
| Appearance, Shadow | Appearance, Color & Gradients; element-specific controls in Images, QR Codes, Barcodes, Icons and Shapes |
| Arrange | Arrange, Align & Layer Order |