Breadcrumbs

Show where users are in the application.

Standard

Sizes

Separator

Custom separator in characters.

Icons

Show more information with icons.

With NextJS

Example for use with next.js.

APIs / Schnittstellendokumentation

Breadcrumbs.Props

AttributeDescriptionTypeAccepted valuesDefault
separatorseparator stringstring-/
sizebreadcrumbs sizeNormalSizesNormalSizesmedium
...native propsHTMLAttributes'id', 'className', ...-

Breadcrumbs.Item.Props

AttributeDescriptionTypeAccepted valuesDefault
hreflink addressstring--
nextLinkin next.js routeboolean-false
onClickclick event(event: MouseEvent) => void--
...native propsAnchorHTMLAttributes'id', 'className', ...-

Breadcrumbs.Separator.Props

AttributeDescriptionTypeAccepted valuesDefault
...native propsHTMLAttributes'id', 'className', ...-

NormalSizes

type NormalSizes = 'mini' | 'small' | 'medium' | 'large'

Co-Creators