Divider block
The Divider block in Seventh draws a horizontal line between blocks. It has settings for spacing, style, width, height and color.
Applies to: Seventh 4.0.0 and later. Added in: Seventh 1.0.0. Last checked: 2026-10-12 against Seventh 4.0.0.
The Divider block draws a horizontal line between other blocks in a section or card. Use it to separate parts of a text or to break up long content.
Where to find it: select Add block inside a section or card in the theme editor, then choose Divider.
Adding a divider between two blocks
Open the section or card
In the theme editor, open the page, then select the section or card that holds the blocks.
Add the Divider
Select Add block and choose Divider. Drag it between the two blocks.
Set the style
Set Style, Height and Color. The line appears in the preview immediately.
How do I change the space around the divider?
Spacing size adds space above the line. The space between the divider and the other blocks also comes from the Inner blocks spacing of the card or the gap of the Content group that holds it. To add space below the line, add an Empty space block after it.
All Divider settings
Every setting in this group, with its type and default.
Spacing size (dropdown, default: Regular): Sets the extra space above the line. Options: None, XXSmall, XSmall, Small, Regular, Large, XLarge.
Style (dropdown, default: Solid): Sets the line pattern. Options: Solid, Dashed, Dotted.
Width (dropdown, default: Large): Sets how much of the available width the line fills: Small 50, Medium 70 and Large 100 percent. Options: Small, Medium, Large.
Height (slider 1 to 20 px, default: 1 px): Sets the line thickness.
Color (color with transparency, default: rgba(0,0,0,0.1)): Sets the line color. Use the transparency slider to make the line lighter.
Related pages
- Empty space block: adds vertical space without a line.
- Content group block: sets the gap between the blocks inside a group.