A Divider is a line that is used to visually differentiate different parts of a UI. They are commonly used in headers and command bars. This divider automatically center algins itself within the parent container and can be customized to be shown in different heights and colors.

For more details and examples visit the official docs. The R package can not handle each and every case, so for advanced use cases you need to work using the original docs to achieve the desired result.


Best practices

Use a divider component to show a sectional or continuity change in the content between two blocks of information. The spacing around the divider is generally determined by the content surrounding it.

There are two recommended divider color combinations:

  1. #C8C8C8/neutralTertiaryAlt divider when used within an #F4F4F4/neutralLighter layout

  2. #EAEAEA/neutralLight divider when used within an #FFFFFF/white layout