Use an icon to add extra context to elements in a layout.
Element includes a limited set which can be edited and expanded.
Usage
Always include text with icons. Use VisuallyHidden if necessary.
Icons should be paired with text, do not assume that the icon alone will be understood by everyone. On web it is recommended to use ems for icon sizes, so they should match the size of the text automatically (and responsively!). For responsive sizing on native the size should be set manually.
Don’t mix icons and pictograms. Icons should be displayed between 16px and 40px. Pictograms have their own preset sizes.