Pieces/Nav

Horizontal tabs with a thin bottom rail and a primary underline under the active label.

Rounded segmented tabs riding a muted track, with a raised card sliding under the active label.

Classic folder-style tabs that sit on a rail, with the active tab bordered and notched into the panel.

Sidebar-style stack of icon + label rows where the active row gets a muted fill and bolder text.

Compact breadcrumb trail with chevron separators and the trailing crumb rendered in bold.

Breadcrumb where each crumb wears a home or folder icon chip and the final crumb has a muted fill.

Breadcrumb that hides middle crumbs behind a dropdown chip so the trail stays on a single row.

Underline tabs that print a pill count next to the label, with the active count filled in primary.

Segmented icon tabs inside a bordered tray, where the active tab flips to the foreground color.

URL-like path breadcrumb using mono segments with forward-slash dividers and a trailing chevron.

Grouped sidebar menu with section labels, icon rows, optional counters, and a muted active state.

Numbered pagination with prev/next chevrons, ellipsis truncation, and a filled primary active tile.

Shadow-lifted menu with icon rows, shortcut hints on the right, and a tinted destructive Delete action.

Right-click menu pointed by a corner arrow with icon rows and mono shortcut hints on the right.

Full-width button that fires a command palette, paired with a search icon and a ⌘K kbd hint.

Mobile tab bar with labeled icons, a raised center create button, and a rose unread counter badge.

Account dropdown with an avatar header, profile and settings rows, workspace switcher, and a Sign out action.

Three-column footer link grid with uppercase section headings and plain-text links underneath each.

Docs-style on-this-page list with left borders and a primary active rail on the current section.

Nav flyout pairing a vertical product list with a gradient promo pane spotlighting a new release.

Multi-step stepper with emerald done, primary current, and muted pending tiles linked by colored rails.

Web-app bottom bar with five labeled icon tabs and a primary indicator above the active one.

Nested file explorer with amber folder icons, chevrons, and a primary fill under the active file.

Open workspace-switcher showing the current pick and a dropdown with sibling workspaces and a new action.