Divider

Usage

A divider is a thin line that groups content in lists, layouts and can be used in tables when needed. See tables for further clarification on when to use a divider.

Best Practices

• Use dividers to separate content into clear groups.

• Dividers should be noticeable in a layout, but not jarring.

• Dividers should only be used if elements cannot be separated using white space.

• Use dividers sparingly, to create groupings rather than separate items.

• Dividers can be used vertically to help group content within a table.

Divider size

Divider do not have any states

• Colour Grey L70 or white if a dark background is being used

• Horizontal divider - 1px height max

• Vertical divider - 1px width max