Menu Icon

Divider

A divider rips page in half. They let users know the relationship between components.

Usage

Division provides to seperate different issues in the page. They differentiate to their visual apperance.

Guidance

  • Divisions should contain a label.
  • They should be distinct and easy to identify.

When to use

  • Use Dividers to emphasize a new subject.

Additional info

  • Consider using a Divider in transition to a new area on page.
  • Consider using a showy Divider line for transitions to further important.
  • Consider using a vertical Divider, if there is a comparison.

Variations

  • There are several types of Dividers with varying degrees of emphasis. Emphasis determines a Divider’s appearance and placement.
  • The updatable properties of Dividers are label, line color, type and orientation.
  • The updatable behaviours of Dividers are plain and dashed.
  • The updatable style features of Dividers are margin, padding, typography and css.
  • The usable dynamic properties of Dividers are dashed, orientation, type, plain, hidden and style.