Skip to content

Breadcrumb

The path to the current page; every item but the last is a link firing select.

Group: Navigation · Kind: macro · in the lite catalog

example

Open in the playground

The same specimen painted by React, SwiftUI, Compose and gpui.

exponential-ui-breadcrumb on Web
exponential-ui-breadcrumb on iOS
exponential-ui-breadcrumb on Android
exponential-ui-breadcrumb on Desktop
Prop Type Required Bindable Description
items [option] yes – The path from the root to the current page.
  • on.select: runs an action

None.

none

No basic catalog component maps here.

Box · Button · Icon · Text

Role: navigation

navigation (breadcrumb); the last item aria-current=page. Labelled breadcrumb; the last item aria-current=page ($a11y).

Keys Action
Tab through the links; Enter select

Recipe parts: Breadcrumb/root Breadcrumb/item Breadcrumb/separator Breadcrumb/link Breadcrumb/current

Keyed by: current :hover :pressed :focus :disabled :checked :open :selected :invalid :dragover

Themes · Write a theme

Button · Icon · Text · Tabs · Segmented · Accordion · Collapsible · Pagination