# Breadcrumbs

Render hierarchical navigation links for nested docs and application sections. Hansel and Gretel would have loved this component.

## Notes

- Use Breadcrumbs for hierarchy rather than tags or filters. It's a trail of digital breadcrumbs so your users don't get lost in the woods.
- Keep labels literal and concise. 'Home > Products > Shoes' is good. 'Home > Things we sell > Things you put on your feet to walk' is bad.
- Don't use them on the homepage. You can't go higher than the roof.

## Properties

| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| items (required) | `BreadcrumbItem[]` | - | List of breadcrumb items. |
| separator | `string` | '/' | The separator between items. |
| class | `string` | - | Additional CSS classes. |

## Example

```astro
<Breadcrumbs items={breadcrumbItems} />
```