Divider Component

A divider component used to separate content.

Properties

Name	Type	Default	Description
type	'thin' | 'medium' | 'bold'	'medium'	The thickness of the divider.

CSS Parts

Name	Description
divider	The main container for the divider.

Check this link to learn how to use CSS parts for Divider Component.

CSS Properties

Token	Default	Description
--tap-divider-background-color	--tap-sys-color-border-primary	The background color of the divider.
--tap-divider-margin	--tap-sys-spacing-4	The margin around the divider.
--tap-divider-thin-height	--tap-sys-spacing-1	The height of the thin divider.
--tap-divider-medium-height	--tap-sys-spacing-2	The height of the medium divider.
--tap-divider-bold-background-color	--tap-sys-color-surface-secondary	The background color of the bold divider.
--tap-divider-bold-height	--tap-sys-spacing-4	The height of the bold divider.