Separator

Give adjacent groups a little distance and a clear boundary.

Interactive preview

Live specimenTry the component

Personal workspace

Team workspace

Add editable source to an initialized React project. Set up antiflex/ui first if you are new here.

Terminal

npx antiflex-ui@0.1.0-alpha.2 add separator

This site previews the latest workspace styles and motion. The published alpha keeps its released styles until the next npm release.

React

<Separator />
<Separator decorative={false} orientation="horizontal" />

All components forward native attributes, className, and refs to their underlying elements.

Prop	Type	Default
`orientation`	`horizontal \| vertical`	`horizontal`
`decorative`	`boolean`	`true`

Decorative separators are presentational. Set decorative=false when the separator communicates a meaningful structural division.