Iconography

When icons appear and how they look.

size.icon

The five answers

Question	Answer	Why
What do icons do?	Actions, status and navigation	Occasional readers need icons for save, share and navigation.
How many icon sizes exist?	One	One size next to text.
What icon style?	Outline	Outline icons stay quiet beside text.
How big are icons next to text?	Match the text	Icons match the text size.
Where do icons work hardest?	Navigation	Icons help most in navigation.

Tokens

Each token points to another token. Values live only on primitives, below.

Token	Points to
size.icon	size.16

The raw values these tokens end at are on Primitives › all kinds.

When to use what

Situation	Use	Not	Why
An icon with no label	Not used: always add a word	An icon button	Occasional visitors do not know icons.
An action on one row or item	Button ghost with a word	An icon on its own	Occasional visitors need the word.