Divider

Our Divider component is a styled horizontal rule. It is a 20% opacity black single line to maintain its contrast on a variety of (light) background colours.

GitHub·Storybook·Playroom

Installation

bash

npm install @nib-components/divider

Usage

jsx

import Divider from '@nib-components/divider';

Interactive demo

jsx

<Stack space={4}>
  <div>nib is one of Australia's fastest growing health insurers providing medical and health insurance to over one million Australian and New Zealand residents.</div>
  <Divider />
  <div>
    We also provide private health insurance cover to more than 130,000 international students and workers in Australia as well as offering international health insurance to expats working and
    travelling overseas.
  </div>
</Stack>

<Stack space={4}>
  <div>nib is one of Australia's fastest growing health insurers providing medical and health insurance to over one million Australian and New Zealand residents.</div>
  <Divider />
  <div>
    We also provide private health insurance cover to more than 130,000 international students and workers in Australia as well as offering international health insurance to expats working and
    travelling overseas.
  </div>
</Stack>

Props

There are no props for this component.

Considerations

The Divider component does not include spacing. You must handle this separately by using the appropriate layout component.

Edit this page