designtokens.fyi

© Design Systems House

State

A type of level to support an alternative visual treatment for when a system is under a new configuration.

Examples

row.chosen.bgColor
input.critical.borderColor

In the above examples, the second level in each token (chosen, critical) describes system state which is expected to modify the final presentation of the experience using this new token. This assumes that tokens for default elements’ states properties exist and are first applied.