The Icon component is a handy tool for controlling size, and flipping right-to-left for international use. Icons are utilized from Calcite's UI Icon library that contains hundreds of unique concepts.
Overview
Icons can be actionable or illustrative graphical representations of intent. For instance they can be used for wayfinding throughout the interface or represent interactive elements - on their own or in combination with text content. Meaningful and consistent use of icons throughout the interface can help the user easily navigate through workflows.
Use icons sparingly to ensure their meaning is conveyed - overloading the interface with graphical elements can be distracting and reduce the significance of those used.
Usage
- Use in Buttons, FABs, or Links when accurately supporting the component's action
- Use in Dropdowns, Comboboxes, Accordions, etc. when it helps with clear decision making
- Anchor to an edge or corner of a view as a supportive action
Sample
Accessibility
It is recommended to set the text value if your icon is semantic to provide context to more users, in particular users of assistive technologies.