Information This site is moving

The Pattern Library is moving to its new home on the Summit design system site.

Go to the Summit site
Pattern Library (ver. 2)

Horizontal rules

Horizontal rules are used to provide a visual break and divide content.

In most cases, <hr> tags are used for visual purposes only. Therefore, it does not need to be announced by a screen reader. Add the attribute aria-hidden="true" so screen readers will ignore the element. If the element should be announced by a screen reader, the aria-hidden attribute can be removed.

Normal horizontal rule

Thick horizontal rule


<!-- Normal horizontal rule -->
<hr aria-hidden="true">

<!-- Thick horizontal rule -->
<hr class="row-divider" aria-hidden="true">