Hr

Element styles for <hr>. A subtle horizontal divider.

---

Styling

Property	Value
border	none
border-top	1px solid var(--color-border-light)
margin	var(--space-2xl) 0

Preview

<div>
  <p style="margin: 0 0 var(--space-md)">Content above the divider.</p>
  <hr style="border: none; border-top: 1px solid var(--color-border-light); margin: var(--space-2xl) 0" />
  <p style="margin: var(--space-md) 0 0">Content below the divider.</p>
</div>

Content above the divider.

---

Content below the divider.

---

Usage

<p>Content above.</p>
<hr />
<p>Content below.</p>