Solaris Design System

Dividers

Dividers are used to seperate content that are placed in one section. There are three types, and they are in different stroke widths.

The table below shows you the types of dividers.

Type Section
Stroke: 4px
:div-section 		Items
Stroke: 2px
:div-item		 Visual
Stroke: 2px
:div-visual
divider Section divider theme light Section divider theme dark Items divider theme light Items divider theme dark Visual divider theme light Visual divider theme dark

Usage

Dividers are used to seperate content in a subtle manner.

When to use Use dividers when there is a big list of content that gets overwhelming to look at without content seperation.

They are also used when seperating a component group from another section. An example of this is a blog article page on the marketing site, dividers are used to seperate the article itself to the article details and related articles.