Dividers are used to display a thin horizontal or vertical line.

Divider composes Box so you can use all the style props and add responsive styles as well. It renders an <hr> tag by default.



It renders an horizontal divider by default.

Editable Example

Changing the orientation#

To change the orientation of the divider, pass the orientation prop and set it to either vertical or horizontal

Part 1
Part 2
Editable Example

Changing the border color#

To change the border color of the divider, as you can guess, pass the borderColor prop.

Part 1
Part 2
Editable Example


The Divider composes the Box component, so you can pass all Box props.

orientationhorizontal, verticalhorizontalThe orientation

Proudly made in 🇳🇬

Released under the MIT License.

Copyright © 2020 Segun Adebayo