Separator

Visual divider between content sections.

Preview

Content above

Content below

Left

Right

Installation

npx drivn add separator

Usage

1 import { Separator } from "@/components/ui/separator"
2 
3 export default function Page() {
4   return (
5     <div>
6       <p>Content above</p>
7       <Separator />
8       <p>Content below</p>
9     </div>
10   )
11 }

API Reference

Prop	Type	Default	Description
`orientation`	"horizontal" \| "vertical"	"horizontal"	Direction of the separator line
`className`	string	—	Additional CSS classes to apply

1	import { Separator } from "@/components/ui/separator"
2
3	export default function Page() {
4	return (
5	<div>
6	<p>Content above</p>
7	<Separator />
8	<p>Content below</p>
9	</div>
10	)
11	}