Separator

import * as Separator from '@radix-ui/react-separator';

export default () => (
  <div>
    <div>Section 1</div>
    <Separator.Root style={{ margin: '15px 0' }} />
    <div>Section 2</div>
  </div>
);

import * as Separator from '@radix-ui/react-separator';

export default () => (
  <div style={{ display: 'flex', alignItems: 'center' }}>
    <span>Item 1</span>
    <Separator.Root
      orientation="vertical"
      style={{ margin: '0 15px', height: 20 }}
    />
    <span>Item 2</span>
  </div>
);

import * as Separator from '@radix-ui/react-separator';

export default () => (
  <div>
    <div>Visual section 1</div>
    <Separator.Root decorative style={{ margin: '15px 0' }} />
    <div>Visual section 2</div>
  </div>
);