Separator
Visual dividers to separate content sections
Horizontal Separator
Section 1
This is the first section with some content.
Section 2
This is the second section with different content.
Section 3
This is the third section with more content.
Vertical Separator
Column 1
Content here
Column 2
Content here
Column 3
Content here
In Lists
Item 1
Description for item 1
Item 2
Description for item 2
Item 3
Description for item 3
Item 4
Description for item 4
In Forms
Personal Information
Account Settings
With Text (Custom)
Some content before the separator...
OR
Some content after the separator...
Usage
import { Separator } from '@/components/ui/separator';
// Horizontal (default)
<Separator />
// Vertical
<Separator orientation="vertical" />
// Custom styling
<Separator className="my-4" />