Separator

Visually or semantically separates content.

Made by shadcn

Powered by

Loading component...

When to use

Separators provide visual or semantic content separation. Use this decision tree:

Installation

Usage

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

<Separator />

Anatomy

The Separator component provides visual content division:

Separator
├── Radix Separator primitive
├── Orientation: horizontal (default) | vertical
├── ARIA role: separator
├── Visual styling: border-based line
└── Semantic meaning for screen readers

Props

Docs API Reference

Credits

We use Radix UI for the separator component.
We take our inspiration from Shadcn UI for the separator style.

Built by malinskibeniamin. The source code is available on GitHub.

On this page