Components
Divider
1px rule for section separators.
On the page background
Same hairline
A horizontal (or vertical) 1px rule. Thickness is --border-width;
colour is --inner-border so separators sit quieter than outer card
frames.
Usage
import { Divider } from "@sophic/portal-ui";
<Divider />
<Divider orientation="vertical" className="h-8" />Props
Prop
Type
Default
Changelog
- 4 October 2026 — Thickness is
--border-width(1px). Full notes - 1 October 2026 — Dropped
surface. Colour is always--inner-border. Full notes - 1 October 2026 —
--inner-border+--hairline-width. Full notes - 29 September 2026 — Matches Card hairline width. Full notes
- 29 September 2026 — Added (horizontal / vertical). Full notes