Skip to content
Navigation

Breadcrumbs

Navigation breadcrumb trail showing the current page location within a hierarchy.

LlmBreadcrumbs + LlmBreadcrumbItem
WCAG AA0 deps

Demo

Live PreviewReact
jsx
<LlmBreadcrumbs>
  <LlmBreadcrumbItem href="/">Home</LlmBreadcrumbItem>
  <LlmBreadcrumbItem href="/components">Components</LlmBreadcrumbItem>
  <LlmBreadcrumbItem>Breadcrumbs</LlmBreadcrumbItem>
</LlmBreadcrumbs>

API (Angular)

PropTypeDefaultDescription
separatorstring'/'Separator character between items

Composition parts

Breadcrumbs is composed from the parts below. Each part is its own component — drop the ones you don't need.

LlmBreadcrumbItem

One crumb. Omit href (or set current) on the final item; it renders as text and carries aria-current="page".

PropTypeDefaultDescription
hrefstringLink destination. Omit for the current page.
currentbooleanfalseMarks the item as the current page. Auto-detected when href is missing.

Import

ts
import { LlmBreadcrumbs, LlmBreadcrumbItem } from '@atelier-ui/angular';