Maskow Labs Logo Livewire Components

Divider

Dividers are used to separate content in a meaningful way. 

1<x-divider>or</x-divider>

With Icon

Dividers can also be used to separate content with an icon. 

1<x-divider>
2    <x-icon name="check--micro" />
3</x-divider>

With Icon and Text

Divide content with an icon and text. 

1<x-divider>
2    <x-icon name="arrow-down--micro" />
3    <span>Drafts</span>
4 
5</x-divider>

Border Color

Change the color of the divider by adding a border color class. 

1<x-divider class="border-red-400" />