# Breadcrumbs

Use to show the user's current location within a hierarchical multi-level structure. Enables 1-click navigation back to parent pages.

import Anatomy from "../../../../../components/Anatomy.astro";
import VariantMatrix from "../../../../../components/VariantMatrix.astro";
import MotionPattern from "../../../../../components/MotionPattern.astro";
import AccessibilityRefs from "../../../../../components/AccessibilityRefs.astro";
import PageMetadata from "../../../../../components/PageMetadata.astro";
import StubFooter from "../../../../../components/StubFooter.astro";
import DoDont from "../../../../../components/DoDont.astro";
import Callout from "../../../../../components/Callout.astro";
import TermList from "../../../../../components/TermList.astro";
import ComponentTabs from "../../../../../components/ComponentTabs.astro";
import ConfidenceChip from "../../../../../components/ConfidenceChip.astro";
import MediaAsset from "../../../../../components/MediaAsset.astro";

<PageMetadata
  slug="components.breadcrumbs.content"
  source="components/dist/registries/dskit.json#breadcrumbs"
  schema={1}
  updated="2026-05-14"
/>

<ComponentTabs component={"breadcrumbs"} activeTab={"content"} />

## Content guidelines

Breadcrumbs show the user's location within the product hierarchy and allow navigation back up the tree.

### Usage

Follow the pattern: Main component / Sub component / Specific item or page name.

### Style

- Use the exact page or item name at each level.
- Do not truncate unless space is severely limited.
- The current page is not a link — it is plain text at the end of the breadcrumb trail.