Kits
Inpage Navigation
Navigation components that connect categories and content sections with multiple visual styles.
Purpose
The Inpage Navigation kit provides navigation patterns used inside pages (not global header navigation). It helps users discover content and categories through clear, reusable navigation components.
What’s inside (typical)
- In-page navigation bars and link lists
- Category/content navigation blocks (tiles, tabs, bullets, sliders depending on the kit)
- Variants for density, emphasis, and visual style
Variables & theming
- Reuses the shared UI Kit variables for all core styling dimensions.
- Navigation components should remain token-driven to keep them consistent with the rest of the system.
Advanced component features
- Property-controlled variants (active state, size, icon/no-icon)
- Auto Layout for responsive wrapping/overflow behavior
- Instance swapping for icons and nested elements
Best practices
- Don’t rename existing components/variables.
- Add new navigation variants as properties where possible to keep the library maintainable.