...
The toolbar may be used in conjunction with 3 components:
Type | Image |
---|---|
Chart |
General guidelines
Structure
...
A toolbar may include:
a variety of controls, such as Action Menus, Buttons, and a Search component.
information items, such as counters and statuses (See data table example above).
Dialog Buttons cannot be used within a toolbar.
If there are sets of controls (for example, table-level actions vs. row-level actions), they should be separated by a vertical divider.
In case of a large number of items, a three-dotted Icon Button may be used, allowing users to open an Action Menu (see the chart example above). In this case, the icon button will be the last control.
...
Where possible, consider using only Icon Buttons, with corresponding Tooltips.
Icon buttons with text should be used to emphasize one or two specific actions.
...
Unless otherwise specified, see our general compliance information in Fundamentals - Accessibility.
Design
Zeplin link | Screen thumbnail |
---|---|
...