Design tokens
Cada projeto guarda suas cores, tipografia e espaçamento como design tokens e os serve pela API. Um app que os lê em tempo de execução mostra uma mudança de marca assim que os novos tokens são publicados.
Um documento de tokens por projeto
Os tokens são um único documento no formato W3C Design Tokens. Cada token é um valor nomeado, como color.brand.primary. Os tipos são cores, famílias de fonte, pesos de fonte, tamanhos de fonte, alturas de linha, espaçamento entre letras, tipografia composta, espaçamento, raios de borda, sombras e bordas. Botões, cards, grids de layout, breakpoints e movimento ficam fora dele.
Referências entre tokens
Um token pode referenciar outro pelo caminho dele, então alterar um valor atualiza tudo que aponta para ele. As referências são resolvidas no servidor antes de os tokens serem servidos. Um documento com ciclo de referência, referência desconhecida, incompatibilidade de tipo ou tipo não suportado é recusado ao ser salvo, e o erro indica o caminho do token.
Rascunho e publicado
Uma edição vai para um rascunho, seja feita no console, em designTokens no seu arquivo de configuração ou pela API. O site no ar continua servindo o último conjunto publicado até que uma release publique o rascunho. Para visualizar tokens não publicados, uma requisição envia o cabeçalho do canal de rascunho com uma chave que tenha o escopo de leitura de rascunhos.
Lendo tokens no seu app
A consulta GraphQL retorna arrays planos e já resolvidos para cada tipo de token, além de source, o documento W3C bruto para ferramentas de build. Um app que lê os tokens da API em tempo de execução incorpora uma mudança publicada sem deploy. Um app que os fixa em tempo de build ainda precisa ser reconstruído.
Leia os detalhes
O guia de design tokens cobre os tipos de token, as formas de editá-los e como o rascunho é publicado.