Separator

import { Separator } from '@raystack/apsara';

export default function Example() {
  return (
    <div>
      <p>Content above</p>
      <Separator />
      <p>Content below</p>
    </div>
  );
}

import { Separator } from '@raystack/apsara';

export default function VerticalExample() {
  return (
    <div style={{ display: 'flex', alignItems: 'center', gap: '16px' }}>
      <span>Left content</span>
      <Separator orientation="vertical" />
      <span>Right content</span>
    </div>
  );
}

<Separator size="small" />
<Separator size="half" />
<Separator size="full" />

<Separator color="primary" />
<Separator color="secondary" />
<Separator color="tertiary" />