Component

Breadcrumb

Accessible hierarchical navigation with RouterLink support, customizable separators and aria-current="page" indicator on the last item.

import { NeuBreadcrumbComponent } from '@neural-ui/core/breadcrumb';
import type { NeuBreadcrumbItem } from '@neural-ui/core/breadcrumb';

Three levels

Five levels

Custom separator (›)

Dot separator (·)

import { NeuBreadcrumbComponent, NeuBreadcrumbItem } from '@neural-ui/core/breadcrumb';

@Component({
  imports: [NeuBreadcrumbComponent],
  template: `<neu-breadcrumb [items]="crumbs" />`
})
export class MyComponent {
  crumbs: NeuBreadcrumbItem[] = [
    { label: 'Inicio', route: '/' },
    { label: 'Productos', route: '/products' },
    { label: 'Portátiles' },  // último sin route = página actual
  ];
}