Spacer element
3 min
The Spacer element adds empty space between elements of a widget. It's an invisible block with a height you set, display-only, with no action or automations.
Available on: all platforms.
Options
Option | What it does | Values / default |
|---|---|---|
Size | Height (and width) of the space | 20 px high |
Position | Static, relative or absolute placement | Static |
Spacing | Padding and margin | — |
Style | Background, border, radius, shadow, opacity, scale | Transparent |
Device, Animation | See Widget elements | — |
Behavior details
- Different space on phones. Switch the editor to mobile view and change the height; it applies to screens up to 480 px wide. Or set Show on: Desktop to drop the space on phones.
- Prefer gap and margin for consistent spacing. A container's Gap spaces every child evenly, and an element's margin moves with it. Use a spacer for one-off space.
- A spacer with a background becomes a colored block, which is a quick way to add a stripe or accent.
Example
A 32 px spacer between the headline and the form on desktop, set to 12 px in mobile view.