Alternatives

Stack — Supports rendering dividers between stack items

Usage

Add a divider to separate and group your content.

<>
  <Box padding="small">
    <Text>First</Text>
  </Box>
  <Divider />
  <Box padding="small">
    <Text>Second</Text>
  </Box>
</>

Vertical

Change the orientation of a Divider using the vertical prop.

Edit in Playroom

<Inline gap="small">
  <Box padding="small">
    <Text>First</Text>
  </Box>
  <Divider vertical />
  <Box padding="small">
    <Text>Second</Text>
  </Box>
</Inline>