Style panel
The Style panel appears at the bottom of the right side panel as soon as an element, a section or the page is selected on the canvas. It gathers the visual formatting common to almost every block: typography, colors, background, margins, borders, shadows, animations…
Each subsection collapses or expands. The summary shown next to the title tells you at a glance what's applied (for example "16px Inter" for the text, or a color swatch for the background), and an indicator reminds you whether the formatting is shared between desktop and mobile or whether you've overridden a value on one of the two modes.
Editing desktop, mobile, or both
A note at the top of the panel says which mode you're editing in: Edits desktop and mobile, Edits desktop only or Edits mobile only.
- In Desktop only preview, with no existing mobile override, your changes apply to both formats. As soon as a value is different on mobile, editing only affects desktop.
- In Mobile only preview, your changes create a mobile-specific override: the desktop value is preserved.
This lets you have, for example, a heading at 64px on desktop and 32px on mobile without having to recopy the entire formatting.
Reset a subsection
Each subsection offers a reset button (Reset settings text) that appears as soon as at least one value is set. It clears every setting in the subsection to revert to the default behavior (often that of the theme).
List of subsections
| Subsection | Doc page |
|---|---|
| Visibility: show or hide the element on desktop, mobile, or both | Visibility |
| Text style: font, size, alignment, case, color | Text style |
| Positioning: vertical alignment of the content | Positioning |
| Background: solid color, gradient or image | Background |
| Inner spacing: inner margins on all four sides | Inner spacing |
| Border: style, thickness, color and bordered sides | Border |
| Rounded corners: global or per-corner radius | Rounded corners |
| Shadow: realistic, flat or preset drop shadow | Shadow |
| Mockup: frame inside a device (iPhone, MacBook, iMac…) | Mockup |
| Filter: opacity, brightness, contrast, sepia, blur… | Filter |
| Animation: appearance on screen (fade, zoom, slide…) | Animation |
Not every subsection is shown for every type of element: the Text style subsection only appears on elements that contain text, Mockup only on images and videos, etc.