Examples show semantic navigation links across prose, navigation, standalone actions, and external destinations.
In context
Four real surfaces — inline doc reading, sidebar nav rail, footer link grid, and an external CTA tray.
Inline documentation
Inline `Link` reads as natural prose.
The MiHCM Design System ships universal primitives styled with semantic tokens. To pull a component into your project, run the install guide or copy the source with the CLI. Every primitive carries a Zod descriptor so a model can return safe generative UI.
Sidebar nav
`variant="nav"` for app-shell link rails.
Footer grid
`variant="muted"` keeps the rail quiet.
External + button-shaped links
External URLs get safe `rel` attributes automatically.
v0.14.1 — Section demos shippedApril 12, 2026
Inside the codebase auditApril 8, 2026
Why we composed our own block libraryMarch 30, 2026
Default
import { Link } from '@mihcm/ui/Link';
<Link href="/components/button/usage">Read button guidance</Link>Variants
<Link href="#">Inline</Link>
<Link href="#" variant="accent">Accent</Link>
<Link href="#" variant="muted">Muted</Link>
<Link href="#" variant="foreground">Foreground</Link>
<Link href="#" variant="nav" data-active="true">Active nav</Link>
<Link href="#" variant="standalone">Standalone</Link>
<Link href="#" variant="button">Button link</Link>External
<Link href="https://designsystem.mihcm.com" external>
Open design system
</Link>