Divider components for Fluent UI
The Divider component represents a visual separator, that may contain content. A Divider can be vertical or horizontal.
To import Divider:
import { Divider } from '@fluentui/react-components';
<Divider />
<Divider>This is a divider</Divider>
<Divider alignContent="center">This is a divider</Divider>
<Divider appearance="subtle">This is a divider</Divider>
<Divider inset>This is a divider</Divider>
<Divider vertical>This is a divider</Divider>
See Fluent UI Storybook for more detailed usage examples.
Alternatively, run Storybook locally with:
yarn start
- Select
react-divider
from the list.
See SPEC.md.
If you're upgrading to Fluent UI v9 see MIGRATION.md for guidance on updating to the latest Divider implementation.