The trail back to where you came from. Two published components, thirteen variants, and a matrix with one cell deliberately left empty.
Two components, thirteen variants
Breadcrumb Item - Variant × State: Link · Link Current · Dropdown · Ellipsis × Default · Hover · Focus, less Link Current / Hover
Breadcrumb - Breakpoint: md · sm
Using the Breadcrumb
Why does Link Current have no hover?
Because it is the page you are on. Hover promises that clicking will take you somewhere, and here it would take you nowhere. The cell is left out of the matrix rather than filled with a state that is unreachable - eleven variants instead of twelve.
Why is focus a border here and a ring everywhere else?
Spacing. Items sit six to ten pixels apart, and a 2px outer ring at that distance collides with the separator next to it. A 1px inner border at half opacity costs no space, so the trail keeps its rhythm with something focused in it.
What is the Ellipsis for?
Collapsing the middle of a long trail. It is a 36px square hit area holding a 15px three-dot mark - much larger than it looks, because it is the one item in the row you are meant to click on a phone. Its dots darken on hover like a link does.
Why does the Breakpoint axis only change a gap?
Because that is the only thing that needs to change. md sits at spacing.2-5 and sm at spacing.1-5, ten pixels down to six. Nothing else about a breadcrumb is responsive - it is one row of text - and an axis that changed more would be inventing a difference that is not there.