Divider
Line to separate content sections visually. Supports variants soft, dashed, and orientation vertical.
Default
By default, the <Divider /> generates a solid, subtle horizontal line that separates content blocks.
Upper content
Lower content
Soft (tenue)
The soft variant uses a border color with lower opacity for more subtle dividers.
Element A
Element B
Dashed (discounted)
The dashed variant uses a dashed line to emphasize visual separation.
Start
End
Vertical
The vertical mode rotates the divider to separate elements in a row.
Element 1Element 2Element 3
Inset (with margin)
The inset prop adds horizontal or vertical margin to separate the line from the container's border.
Section A
Section B
Combinations
You can combine multiple props like soft + dashed or vertical + soft for greater visual control.
FirstSecondThird