Skip to content

Divider

Lenny P. edited this page May 17, 2025 · 1 revision

Divider Component

The Divider component renders a horizontal rule (<hr>) to visually separate content sections. If content is provided in the slot, it displays the text centered between two horizontal lines. It supports dark mode styling and accepts additional HTML attributes.

Example Usage

<x-divider />

<x-divider>Section Title</x-divider>

Props

  • Additional HTML attributes
    You can pass any valid HTML attributes (like classes or IDs) which will be merged with the default styles.

Overview

This Divider component provides a clean and customizable way to separate content visually. It supports a simple horizontal line or a labeled divider with text in the middle, adapting its style for light and dark modes using Tailwind CSS.

Clone this wiki locally