material-breadcrumbs

Light-DOM breadcrumbs over server-rendered links (Unpoly-friendly) — the component adds nav semantics and marks the last crumb aria-current="page"; separators are CSS and mirror in RTL.

plain server markup — links + a final <span>; the last crumb is auto-marked current

Home Purchasing Purchase orders PO-2026-0142

two levels only · single crumb

Settings Notifications Dashboard

RTL — separators flip to chevron_left

الرئيسية المشتريات أمر شراء ٠١٤٢
Sample usage (Django / Unpoly)
<material-breadcrumbs>
  <a href="{% url 'home' %}" up-target="main">Home</a>
  {% for crumb in breadcrumbs %}
  <a href="{{ crumb.url }}" up-target="main">{{ crumb.title }}</a>
  {% endfor %}
  <span>{{ object }}</span>
</material-breadcrumbs>