Dividers
Horizontal rules with various weights and styles. Use to separate content sections or add visual structure.
Weights
Control line thickness from hairline to heavy.
<hr /> <!-- Default -->
<hr class="divider--hairline" />
<hr class="divider--semibold" />
<hr class="divider--bold" />
<hr class="divider--extrabold" />
<hr class="divider--heavy" />Hairline
Regular (default)
Semibold
Bold
Extra bold
Heavy
Styles
Color and pattern variations.
<hr class="divider--accent" />
<hr class="divider--dotted" />
<hr class="divider--dashed" />