Size

Details how size tokens help standardize icons, UI elements, and layout blocks, with a reference table for medium and large families.

Used for sizes of internal UI elements like text, icons, carets.

Do not use these tokens for any spacing, margins, paddings or external width or height definitions of elements. External widths and heights should always be defined dynamically by the size of the contents and their paddings, never statically by a token.

Used as a default, for most of the cases.

Used for elements that are semantically larger, or to create more emphasis. Examples include large icons, large buttons, and layout blocks.