Divider
Divider
Divider
provides a thin, unobtrusive line for grouping elements to reinforce visual hierarchy.
Examples
How to use
Accessibility
Density
Mode
Divider has three variants: primary
, secondary
and tertiary
. The default variant is primary
. You can use the variant
prop to change
- Primary dividers meet the 3:1 contrast ratio against Salt backgrounds, needed for graphical elements in WCAG 2.1. They are ideal to distinguish between interactive elements or between distinct interactions.
- Secondary dividers are ideal to distinguish between regions and containers.
- Tertiary dividers are suitable for less prominent separations between repeated elements, where a softer distinction is desired.