Divider

The Divider component provides lightweight visual separation between content sections using semantic HTML.

Ignix Lite dividers support horizontal and vertical orientations with minimal accessible styling.

---

Horizontal Divider

Preview

Overview Section

---

Analytics Section

---

Settings Section

Code

<p>Overview Section</p>

<hr />

<p>Analytics Section</p>

<hr />

<p>Settings Section</p>

---

Vertical Divider

Preview

Home

---

Docs

---

Components

Code

<div style="display:flex; align-items:center; gap:1rem; height:40px;">

  <span>Home</span>

  <hr data-orientation="vertical" />

  <span>Docs</span>

  <hr data-orientation="vertical" />

  <span>Components</span>

</div>

Attributes

Attribute	Type	Description
data-orientation	'vertical'	Applies vertical divider orientation
hr	element	Semantic content separator