Components / Layout

Separator macrolite

A hairline that divides content.

Built from
Box
A2UI basic
Divider
Children
none
Loading the renderer…
Separator rendered by the React renderer on Web
Web React
Separator rendered by the SwiftUI renderer on iOS
iOS SwiftUI
Separator rendered by the Compose renderer on Android
Android Compose
Separator rendered by the gpui renderer on Desktop
Desktop gpui

View exponential-ui-separator, painted by each native renderer.

orientation · horizontal
orientation · vertical
PropTypeDefaultDescription
orientationhorizontal | vertical"horizontal"A horizontal rule or a vertical bar.

No events, no slots. Children: none.

Role
separator
Semantics
separator

Not focusable; no keys.

Recipe parts
Separator/root
Keyed by
:hover:pressed:focus:disabled:checked:open:selected:invalid:dragover

Themes · Write a theme

Hairline divider

One pixel of the row stroke.

More

The only rule allowed inside a group, and the only one anywhere in the glass set.

Webok
Separatorpackages/ui/src/separator.tsx

Inside a group the same hairline comes from GlassGroup's divide-y, not from a Separator element.

Desktopok
surface::glass_row_dividerapps/desktop/crates/ui/src/surface.rs