Token Sets e Themes no Tokens Studio
info
Conteúdo adaptado da documentação oficial do Token Studio (TS), disponível aqui.
No Tokens Studio, Token Sets e Themes são recursos essenciais para estruturar, organizar e aplicar os design tokens de forma flexível e consistente em um design system.
O que são Token Sets?
Token Sets são conjuntos de tokens criados para diferentes contextos, como cores, tipografia, espaçamento ou até configurações específicas de um projeto.
Principais benefícios:
- Organização semântica: separar tokens por categoria ou componente.
- Flexibilidade: cada set pode ser ativado ou desativado quando necessário.
- Sobrescrita controlada: o último set ativo substitui tokens duplicados de sets anteriores.
- Fonte de referência: sets podem ser marcados como "Source", servindo apenas como base (não exportados ao Figma).
Gestão de sets:
- Criar: clique em + e nomeie o set.
- Editar: renomear, excluir ou marcar como fonte pelo menu de contexto.
- Estruturar: usuários Pro podem organizar sets em pastas via Multi File Sync.
O que são Themes?
Themes (temas) permitem aplicar diferentes combinações de tokens para representar variações de design — como claro/escuro, múltiplas marcas ou acessibilidade.
Funcionalidades:
- Criar temas selecionando os Token Sets que irão compor cada um.
- Nomear os temas para fácil identificação.
- Definir dimensões múltiplas (Pro), como:
- Modo de cor: light/dark.
- Marca: Opala / outra marca.
- Idioma ou região.
Antes do recurso multidimensional:
- RedPlanet-Light-Default-English
- RedPlanet-Dark-High-German
Com o recurso multidimensional:
- Basta definir modo, marca e idioma separadamente → combinações automáticas.
Como usar no projeto
- Ativar Token Sets: selecione os sets desejados → tokens ficam disponíveis no arquivo.
- Aplicar Themes: escolha combinações no menu de temas → o Figma atualiza automaticamente as variáveis e tokens aplicados.
- Respeitar a hierarquia: sets e themes ativos sobrescrevem valores de forma previsível, mantendo consistência.
dica
Mais detalhes: