Dropdowns are used to select an action or set filter criteria. For dropdown navigation see navigation.
Selecting an action
Use a single select for dropdowns that initiate an action.
- Use a dropdown button. To emphasise or de-emphasise use a primary or link dropdown button.
- List section:
- Group items that are related.
Setting filter criteria
Dropdown filters can be single select or multi-select. Selected items stay selected when the dropdown is closed.
- Trigger label:
- Dropdowns explain themselves. Use natural language - 'Any issue type' rather than 'Issue types: All'.
- Label with selections:
- All selected items appear in the label.
- Section heading:
- Use headings to distinguish two or more groups of similar objects. When used in a multi-select, heading text should follow the pattern 'All [things being selected]'.
- Error message:
- Write errors inline. Where possible, a next action should be given.