Elements, the building blocks for any website
Find out how to add elements and play around with them to create any layout you want.
1. Elements panel
In the Elements panel you can find all the elements that will help you build your website's structure. The types of elements that we currently support are:
Layout | Typography | Media | List | Forms | Interactions |
|---|---|---|---|---|---|
Row | Text | Image | List | Form | Dropdown |
Column | Heading | Video | List-item | Button | Language switcher |
Grid | Link | Iframe | Array mapper | Label | Navbar |
Slot | Date | Code embed |
| Input | Slider |
|
| Lottie |
| Textarea | Accordion |
|
| Google Maps |
| Checkbox |
|
|
|
|
| Radio button |
|
|
|
|
| Select |
|
|
|
|
| Option |
|
All the above are bound to existing HTML tag elements. In the brackets there are the keyboard shortcuts that you can use to add these elements into Canvas.
2. Adding elements in stage
Learn how to add elements in stage
To add any of the elements in the Left panel to your project:
- Click on the Elements button in the Left panel
- Drag and of the elements to the canvas
Alternatively, instead of dragging you can click on an element and it will be added to the selected container, as the last element in the container.
As noted before, in the Elements Panel some items have the keyboard shortcut added in parentheses next to the title. Simply press the right key and the element will be added as a child of the currently selected node. If the selected node doesn't support children, it will be added as a sibling.
Updated on: 28/03/2025
Thank you!