<nav class="c-nav c-nav--breadcrumb" role="navigation" aria-label="Breadcrumb">
    <ul class="c-nav__list" role="menubar">
        <li class="c-nav__list-element">
            <a href="#" role="menuitem" class="c-nav__link" title="Home">Home</a>
        </li>
        <li class="c-nav__list-element">
            <a href="#" role="menuitem" class="c-nav__link" title="Child page">Child page</a>
        </li>
        <li class="c-nav__list-element">
            <a href="#" role="menuitem" class="c-nav__link" title="Grandchild page">Grandchild page</a>
        </li>
        <li class="c-nav__list-element">
            <span class="c-nav__link c-nav__link--current" role="menuitem" aria-current="page" title="Current page">Current page</span>
        </li>
    </ul>
</nav>
<nav class="c-nav c-nav--breadcrumb" role="navigation" aria-label="Breadcrumb">
    <ul class="c-nav__list" role="menubar">
        <li class="c-nav__list-element">
            <a href="#" role="menuitem" class="c-nav__link" title="Home">Home</a>
        </li>
        <li class="c-nav__list-element">
            <a href="#" role="menuitem" class="c-nav__link" title="Child page">Child page</a>
        </li>
        <li class="c-nav__list-element">
            <a href="#" role="menuitem" class="c-nav__link" title="Grandchild page">Grandchild page</a>
        </li>
        <li class="c-nav__list-element">
            <span class="c-nav__link c-nav__link--current" role="menuitem" aria-current="page" title="Current page">Current page</span>
        </li>
    </ul>
</nav>
/* No context defined for this component. */

The breadcrumb menu is a modified variant of the nav menu, to get this to work simply add the .c-nav–breadcrumb class to the main .c-nav container.