Design tokens

Variable mapping

Suba duas collections exportadas do Figma e acompanhe o caminho de cada cor: o valor entra pela esquerda, ganha nome na collection de primitivos e chega ao alias que a interface consome. Hex e alpha aparecem só na primeira coluna — para saber a cor de um token, siga o fio.

Collection 1

Nenhum arquivo

Arraste um .zip ou .json aqui

Collection 2

Nenhum arquivo

Arraste um .zip ou .json aqui

A ordem do upload não importa: quem tiver os aliases é reconhecida como a collection final.

ordem
Valor · hex + alpha
· primitivo
· alias

Três colunas

Um valor pode alimentar mais de um primitivo, e um primitivo pode alimentar vários aliases. A largura da cadeia mostra o alcance real de uma cor.

Fan-out

O contador ao lado do nó diz quantos consumidores ele tem à direita. Quanto maior, mais coisas mudam de uma vez quando ele muda.

Estados

Local é um alias que guarda valor próprio em vez de apontar para um primitivo — o fio pula a coluna do meio. Quebrado é um alias cujo alvo não existe na outra collection.