Laravel Separator Component
Free · MITA visual divider to separate content sections, supporting horizontal and vertical orientations with optional labels.
A Separator built for the TALL stack — Blade, Livewire 3 & 4, Alpine.js and Tailwind CSS 4.
Server-rendered by default, dark-mode ready, and WCAG-minded. Drop it in with a single Blade tag:
<x-aura::separator>
Installation
composer require bluestarsystem/aura-uiUsage
<x-aura::separator />See the full API, props and live examples in the Separator documentation.
Overview
The <x-aura::separator> component renders a thin line to visually divide content into sections. It supports horizontal and vertical orientations, multiple border styles, and an optional text label centered on the line. Separators are useful for grouping related content and improving visual hierarchy.
Use separators for:
- Dividing form sections
- Separating sidebar groups
- Breaking up long pages of content
- "Or" dividers between login methods
Props
| Prop | Type | Default | Description |
|---|---|---|---|
orientation |
string |
'horizontal' |
Direction of the line: horizontal, vertical |
label |
string|null |
null |
Optional text label displayed centered on the line |
variant |
string |
'default' |
Border style: default (solid), dashed, dotted |
See more examples and every variant in the Separator documentation.