Component

Separator

Backed by @base-ui/react/separator. Anatomy is fixed: a single root part. Base UI reference.

Install

npx bambiui add separator

Import from your own project source, never from Base UI directly, and never from a published bambiui package:

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

Variants

States

Hover, active, and focus-visible are styled but cannot be shown statically. Use the component with a mouse or keyboard to verify those interaction states.

Supported states: `default`.

Props

PropTypeDefault
orientation"horizontal" | "vertical""horizontal"

Native props and refs supported by the underlying Base UI primitive are preserved.

Tokens

Override any of these in your theme CSS to restyle Separator:

  • --bambi-divider-color
  • --bambi-divider-size