Breadcrumbs are a navigation tool mean to show the path that a user has followed on the site to get to their current page.
Name Description
slot[name=""] The default slot for the breadcrumbs, typically a group of breadcrumb-item components
slot[name="back-navigation"] Used to customize the appearance of the back navigation button that shows up on smaller screens
slot[name="separator"] Used to customize the separator that is used for all child breadcrumb-item components
::part(base) The root element of the shadow DOM
::part(back-navigation) The back navigation element
::part(items-list) The ol element that wraps the default slot
Breadcrumbs Default Variant Home Second Crumb Third Crumb
Breadcrumbs Inverse Variant Home Second Crumb Third Crumb
Breadcrumbs With Custom Text Separator | Home Second Crumb Third Crumb
Breadcrumbs With Custom Icon Separator Home Second Crumb Third Crumb
 The breadcrumb item component is used as a child of the suite-breadcrumbs component.
Name Description
slot[name=""] The default slot for the breadcrumb item, usually used to display text for the anchor
slot[name="separator"] Can be used to show a custom separator for an individual breadcrumb-item
::part(base) The root element in the shadow DOM, a li element
::part(link) The link element in the breadcrumb item, an a element
::part(separator) The wrapper around the separator slot, a div element