Skip to main content

Divider

Create clear visual separation between elements in your user interface.

Anchor to propertiesProperties

Anchor to color
color
"base" | "strong"

Modify the color to be more or less intense.

Anchor to direction
direction
"inline" | "block"

Specify the direction of the divider.

An 'inline' divider separates blocks of content. In a left-to-right or right-to-left writing mode, this would typically be a horizontal line.

A 'block' divider separates items within the current line of content. In a left-to-right or right-to-left writing mode, this would typically be a vertical line.

Was this section helpful?

Code

<s-divider></s-divider>

Preview

Anchor to useful-forUseful for

  • Separating elements inside sections.
  • Visually grouping related content in forms and lists.
Was this section helpful?