Skip to main content
HomeComponentsDivider
warning
This is a beta release of the Quantum web libraries
Please be careful when using them in production, as they may contain bugs, unstable breaking changes, and incomplete features.
Go to the latest version

Divider

Dividers help you bring rhythm and clarity to your interfaces by separating elements. Separation of elements also comes in pair with the grouping of ones, thus a powerful tool to raise your information architecture.

Sizes​

The divider comes in three sizes. By default, the divider comes in medium size.

Small
Medium
Large
<QtmDivider size="small"></QtmDivider>
<QtmDivider size="medium"></QtmDivider>
<QtmDivider size="large"></QtmDivider>

Orientation​

The divider can be used in two main directions: horizontal and vertical. By default, the divider comes in horizontal orientation.

Horizontal
Vertical
<QtmDivider orientation="horizontal"></QtmDivider>
<QtmDivider orientation="vertical"></QtmDivider>

Shape​

The divider can be used in two main shapes: rounded and sharp. By default, the divider has a rounded border.

Rounded
sharp
<QtmDivider shape="rounded"></QtmDivider>
<QtmDivider shape="sharp"></QtmDivider>

API​

Loading API documentation...

Spotted a bug, have a question, or want to suggest a new feature?

Submit an issue on GitLab