Separator
Visually or semantically separates content. Built on Base UI's separator primitive.
Last updated January 1, 1980
CreditsModifiedPublished
Copied from shadcn/ui.
- Improved RTL support — the default separator icon and menu layout mirror correctly with logical properties
Overview
Installation
Usage
import { Separator } from "@/components/ui/separator"
export function Example() {
return <Separator />
}Examples
Vertical
Use orientation="vertical" for a vertical separator.
Menu
Vertical separators between menu items with descriptions.
List
Horizontal separators between list items.
RTL
Receipt breakdown
A Persian-market pattern: horizontal separators dividing a price breakdown, with right-to-left digits and Toman currency.
API Reference
Separator
API reference: Base UI Separator .