- Folder
- src/components/NavLink/
- Props
- href: the section hash, for example #experience
- active: marks the current section (default false)
- children: the label text
- Tokens
- Label: mono uppercase label, Text Muted at rest, Text on hover, focus and when active
- Line: 1 px tall, current color, 32 px at rest and 64 px on hover, focus and when active
- Motion
- Line: a 64 px line scaled 0.5 → 1 from its left edge (32 → 64 px) over 150 ms standard, and the label slides 32 px right with it; colour 150 ms
- Under reduced motion the line and the label jump at once, the colour fades stay
- Accessibility
- aria-current on the active link
- Label text stays visible at rest in fg-muted, 4.6:1 in light