```suggestion
- Design teams **may** use a stepper for complex and lengthy workflows that might not fit within one viewport, allowing users to manage the process in smaller, more digestible sectio...
```suggestion
- Design teams **should** use a stepper when there are more than two steps, as this helps users navigate through the process more effectively and understand their progress.
```
```suggestion
- Design teams **should** use a stepper when a preview or summary of each step is needed, as this provides users with context and clarity about what to expect throughout the process....
```suggestion
- Design teams **must** use a stepper when users need the ability to navigate freely to other parts of the application during the workflow. If access to other parts of the applicatio...
```suggestion
- Design teams **must** use a stepper when there are many steps with a small dataset in each step. For longer forms with fewer steps, use a [timeline](https://clarity.design/document...
```suggestion
- Design teams **must** use a stepper when users require more detail than step titles to understand the process, as this provides necessary context and guidance for completing each s...
```suggestion
- Design teams **must** use a stepper when users need to see the forms in line with the rest of the page content, as this approach helps maintain context and flow, reducing cognitive...
```suggestion
The [stepper](https://clarity.design/documentation/stepper) is an accordion-like component that organizes multi-step processes into two or more expanding panels, helping to simplify ...
```suggestion
- Design teams **must** use short and concise labels for navigation items to prevent the need for an ellipsis. Lengthy labels are trimmed and followed by an ellipsis, which can reduc...
```suggestion
- Design teams **must** use normal font weight for child links to ensure they are visually distinct from top-level navigation items and maintain a clear hierarchy. This approach alig...
```suggestion
- Design teams must use a caret on the right-hand side to expand and collapse navigation groups, providing users with clear visual indicators of available actions.
```
```suggestion
- Design teams **must** use semi-bold font weight for top-level navigation items, as this aligns with Clarity's design principles by creating a clear visual hierarchy and improving r...
```suggestion
- Design teams **should** use icons to describe navigation items, as they provide helpful context when the navigation is collapsed, enhancing user understanding and navigation effici...
```suggestion
- Design teams **must** place icons to the left of the top navigation labels to ensure a consistent layout and improve the overall usability of the navigation.
```
```suggestion
- Design teams **must** maintain consistency in using icons on navigation items. Avoid using icons for some top navigation items while leaving others without, as this can create conf...
```suggestion
- **Must not** use vertical navigation with a header and a sub navigation menu. Having too many places for navigation will be confusing for users.
```