Multistate small checkboxes
Use multistate small checkboxes to allow users to select one or more options from a list where options can have a blocked state.
List the options in alphabetical order, unless there’s a specific reason to use a different order.
Each option should be:
- capitalised
- unselected by default
Do not use checkboxes if users can only select one option, use Radio buttons instead.
Where options will never be blocked off, use Checkboxes.
Option without extra information
When an option in a list has no extra information.
Option with extra information
When an option in a list has extra information.
Blocked option
When an option in a list is blocked.
All options have the same extra information
Use a slate primary without title panel at the top of the checkbox list to display extra information if it's the same for all options. You can then remove the extra information from each option.
All options are blocked
Use a warning panel to tell the user that all options are blocked.
With error
Display an inline error when there's something wrong. For example, when a user tries to proceed without selecting an option and the question is mandatory.