RemixBreadcrumbs

A hierarchy of links to the current page in an application, specifically for Remix.

Usage

<RemixBreadcrumbs />

Here's the <RemixBreadcrumbs /> component in action.

1. Home
2. Docs
3. Components
4. Navigation
5. RemixBreadcrumbs

Features

• Automatically generates breadcrumbs based on the current route.
• The last link is automatically marked as the current page using aria-current.

Usage Note

To include a route in the Breadcrumbs, add a breadcrumb attribute to your route's handle. Customize the attribute value to suit your needs.

export const handle = {
	breadcrumb: 'Docs',
}

You have complete control over which routes are included in the Breadcrumbs and you can customize the breadcrumb text for each route.

Source