Separator

Visual divider, horizontal or vertical.

Installation

npm install @aspyn-io/kit @aspyn-io/tokens

import { Separator } from "@aspyn-io/kit";

Horizontal

Aspyn Kit

Design system primitives.

Next section…

<div>
  <p className="text-sm font-medium">Aspyn Kit</p>
  <p className="text-sm text-muted-foreground">Design system primitives.</p>
</div>
<Separator className="my-4" />
<div className="text-sm">Next section…</div>

Vertical

Docs

Components

Examples

<div className="flex h-5 items-center gap-4 text-sm">
  <span>Docs</span>
  <Separator orientation="vertical" />
  <span>Components</span>
  <Separator orientation="vertical" />
  <span>Examples</span>
</div>