Separator

Visually or semantically separates content.

Radix Primitives

An open-source UI component library.

Blog

Docs

Source

import { Separator } from "@/components/ui/separator"  export function SeparatorDemo() {  return (  <div>  <div className="space-y-1">  <h4 className="text-sm leading-none font-medium">Radix Primitives</h4>  <p className="text-muted-foreground text-sm">  An open-source UI component library.  </p>  </div>  <Separator className="my-4" />  <div className="flex h-5 items-center space-x-4 text-sm">  <div>Blog</div>  <Separator orientation="vertical" />  <div>Docs</div>  <Separator orientation="vertical" />  <div>Source</div>  </div>  </div>  ) }

Installation


pnpm dlx shadcn@latest add separator

Usage

import { Separator } from "@/components/ui/separator"

<Separator />

Select Sheet

On This Page

Installation Usage

Deploy your shadcn/ui app on Vercel

Trusted by OpenAI, Sonos, Adobe, and more.

Vercel provides tools and infrastructure to deploy apps and features at scale.