Purpose

A level that indicates the kind of elements to associate a token to based on its reason for being in the experience.

Examples

action.primary.bgColor
control.fgColor
surface.auxiliary.bgColor
text.primary.fontWeight

In each of the examples above, the first level indicates the group of components this token is meant to be used within.

• action suggests that this token is meant for components that trigger an action such as navigation or form submission.
• control suggests that this token is meant for components which allow a user to control the experience.
• surface suggests that this token is meant to describe surfaces which content would be placed upon.
• text suggests that this token is meant to describe text content and its properties.