Defining a global collection of spacing in

global tokens such as

space-1 = 4px,

space-2 = 8px,

space-3 = 12px and so on..

creating alias tokens such as (linked to global)

padding-16 = space-4,

padding-24 = space-6 and so on..

which are then used in components like (linked to alias)

button-padding-left = padding-16

button-padding-right = padding-16

Similarly you can expand all tokens to cover color, spacing, border radius, and opacity in Figma variables.

While Figma doesn’t yet support typography, gradients, and shadows in variables, you can create them using local styles, and you’ll be able to publish them later.

To keep the Figma workspace clutter-free, you can choose not to display alias and global tokens in the right-side or properties panel. Simply click on the settings at the end of each token row and select where you’d like to show them.

Continue reading the whole blog here Medium blog