Token values and types

You can specify the type of your tokens in Interplay to control their behaviour.

Token value

A token value may be:

• A simple value e.g. color string such as #276EF1

• A reference another token e.g. {button.background.success}, which references a color token.

• A composite object made up of values and references e.g. a typography token, which defines values for fontFamily, fontSize, color and lineHeight (which themselves can be references)

Type is inherited

A tokens or token group inherits its types from its parent group, unless it has its own type assigned.

This makes it easy to set the types across large numbers of tokens by setting the types on the container groups at the root of your design token group tree structure.

Reference tokens

Tokens can reference or alias other tokens.

A reference token has the type of the token it references.

If a token references another token for its value, the value field is locked for editing:

If you want to override this behaviour you can choose to unlink by clicking on the icon that appears when you mouseover the value field.

Computed Tokens

Computed or function token values allow for manipulation and conversion of token values. This can be very useful to generate a scale from a core reference token. You can compute token values using supported functions in the token value field.

To access the formula editor, type an equals sign in the value field or click the link in the token editor:

You can choose a function and provide the required values. Each function gives example syntax on how to use it.

e.g. Color functions

e.g. multiply: