[[figma]] recently introduced Variables. Here's a quick breakdown.
Multiple types are supported: color, number, string, boolean. Variables can also be placed in a collection.
Each variable key can have only a single value per mode. A mode lets you tie multiple values to a single variable, depending on what mode you are in. For example, text-color can have a lightMode value, and a darkMode value. Modes can be set on components/frames/etc, and can be set to inherit from the parent mode. This lets you create a [[20220822094537-themeable-design-systems]].
Variables allow for abstractions to create [[20211029153348-semantic-design-tokens]]. Each variable can reference other variables.
In general, they are applied to designs in a similar way to styles. e.g. the colour picker for your heading can now reference a variable. Since variables support more than just colours, most fields allow you to reference a variable, e.g. corner radius, padding, etc.
Note that styles still exist and are slightly different. When picking them in the inspector, styles are represented by circles, variables are rectangles. Note that styles can store sets of values, but can't reference other styles.
https://help.figma.com/hc/en-us/articles/15339657135383-Guide-to-variables-in-Figma