byDefaultHuman
Components

Separator

A hand-drawn horizontal or vertical divider line.

Installation

package manager
npx shadcn add https://bydefaulthuman.fun/r/separator.json

Props

PropTypeDefaultDescription
className
string
Additional Tailwind classes applied to the component.
id
string
Optional stable id used for sketch seeding and accessibility.
label
string
Optional label text shown with the component.
orientation
"horizontal" | "vertical"
"horizontal"
Controls the component layout direction.
theme
CrumbleTheme
Overrides the global Crumble theme for this instance.

Vertical

LeftRight

Accessibility

Separator renders role="separator" and sets the correct aria-orientation. Use the optional label only when the divider genuinely introduces a new section.

Examples

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

<Separator />;