- Where to find it
- Labelled Line Style in the "Selected Component" section of the Modify drawer.
- Offered by
- The Divider component. Other components do not have this setting.
- Per device
- Yes — you can set one value for every screen, or separate values for phone, tablet, and desktop.
In plain English
A divider can be a continuous line, a row of short strokes, or a row of dots. All three separate one part of a page from the next; they differ in how much they insist on it.
Solid is the one to reach for unless you have a reason not to. It reads as a real edge — the end of a section, the boundary between a header and what follows. Dashed and dotted read as lighter, more provisional marks: a fold rather than a wall. They suit a divider inside a card, or between items in a list, where a solid line would carve the layout up more than you meant.
This is the only part of the line the divider itself decides, along with how thick it is. Its colour and how far it runs are set on the column.
What each option does
| Option | What you will see |
|---|---|
solid | One unbroken line. The default. |
dashed | A line of short strokes with gaps between them. |
dotted | A line of dots. The lightest of the three. |
When you would use it
- Solid between two major sections of a page.
- Dashed or dotted for a lighter break inside a card or a list, where a solid rule would be too emphatic.
- Dashed to suggest something is cut out or detachable, such as a coupon.
How to change it
- Click the divider on the canvas.
- In the Modify drawer, open "Selected Component", then "Line Style".
- Choose solid, dashed, or dotted.
- Uncheck "Same value for all resolutions" to use a different style on phones.
One value, or one per device? Every input in this setting sits under a “Same value for all resolutions” checkbox. Leave it checked for a single value everywhere, or uncheck it to give phones, tablets, and desktops their own. How per-device values work.
Watch out for
- Dashed and dotted lines are much harder to see at 1px than solid ones. Raise Thickness to 2px or more when you use them, or the divider all but disappears.
- Setting Border on the column replaces the divider's line entirely, and a border applies to all four sides rather than just the top. If a divider suddenly looks like a box, that is why.
- Colour is not here. The line is drawn in the surrounding text colour, so change it with Text Color on the column.
Related settings
Where to go next
- Back to the Divider component — everything else it can do.
- The Composer — the editing surface these settings live in.
- Publishing — how a change like this reaches your live site.