Navigation

Move between product destinations.

States

defaulthoverfocusdisabledactive

Tokens

background	`{semantic.surface.primary}`
foreground	`{semantic.text.primary}`
border	`{semantic.border.default}`
radius	`{radius.md}`
padding	`{space.3}`
focusRing	`{semantic.focus.ring}`

Accessibility

{
  "ruleIds": [
    "STYLE-A11Y-001"
  ],
  "focusVisible": true,
  "keyboard": "Tab moves between destinations; current destination is programmatically indicated."
}

Do / Don't

Do

Mark the current destination.

Don't

Do not use vague labels such as More when a destination can be named.