Laravel Breadcrumbs Component

Free · MIT

Navigation aid showing the current page location within a hierarchical structure.

A Breadcrumbs built for the TALL stack — Blade, Livewire 3 & 4, Alpine.js and Tailwind CSS 4. Server-rendered by default, dark-mode ready, and WCAG-minded. Drop it in with a single Blade tag: <x-aura::breadcrumbs>

Try it live in the docs Install free

Installation

composer require bluestarsystem/aura-ui

Usage

<x-aura::breadcrumbs :items="[
    ['label' => 'Home', 'href' => '/'],
    ['label' => 'Products', 'href' => '/products'],
    ['label' => 'Details'],
]" />

See the full API, props and live examples in the Breadcrumbs documentation.

Overview

The Breadcrumbs component renders a navigation trail that helps users understand their current location within the application hierarchy. Each item can be a link or plain text (for the current/last item). The component supports different separator styles and optional icons per item.

Use breadcrumbs for:

Multi-level page hierarchies
Admin panel navigation
Content management paths
E-commerce category navigation

Props

Prop	Type	Default	Description
`items`	`array`	`[]`	Array of breadcrumb items. Each item: `['label' => string, 'href' => string\|null, 'icon' => string\|null]`
`separator`	`string`	`'chevron'`	Separator style: `chevron` (>), `slash` (/), `dot` (.)

Item Structure

Each item in the items array accepts:

Key	Type	Required	Description
`label`	`string`	Yes	Display text for the breadcrumb
`href`	`string`	No	URL. Omit for the current page (last item)
`icon`	`string`	No	Icon name displayed before the label