Theme: Light | Lightest | Dark | Darkest Scale: Medium | Large

Divider

Usage notes

Dividers bring clarity to a layout by grouping and dividing content in close proximity. They can also be used to establish rhythm and hierarchy.

Horizontal

Toggle markup


        <hr class="coral-Divider--L">
        <hr class="coral-Divider--M">
        <hr class="coral-Divider--S">

Vertical

Toggle markup


        <hr class="coral-Divider--L coral-Divider--vertical" style="height:50px;">
        <hr class="coral-Divider--M coral-Divider--vertical" style="height:50px;">
        <hr class="coral-Divider--S coral-Divider--vertical" style="height:50px;">