Design Tokens
A base invisível que conecta todos os produtos da Wake Hub.
Uma linguagem única para todos os produtos.
Os Design Tokens eliminam inconsistências. Cada cor, fonte, espaçamento e comportamento passa a possuir uma única definição reutilizada por todo o ecossistema.
Consistência
Uma única definição para cada valor visual.
Escalabilidade
Escala para milhares de componentes sem retrabalho.
Velocidade
Desenvolvimento mais rápido com valores prontos.
Reutilização
Tokens compartilhados entre todos os produtos.
Padronização
Padrões visuais centrais e governados.
Color Tokens
A paleta completa do Ecossistema Wake Hub.
Cor principal da marca
Cor secundária / azul
Cor de destaque
Estados de sucesso
Estados de alerta
Estados de erro
Informações
Fundo principal
Superfícies / cards
Glassmorphism
Bordas
Divisores
Overlays / modais
Texto principal
Texto secundário
Texto desabilitado
Glow roxo
Glow azul
Glow ciano
Typography Tokens
Hierarquia tipográfica completa do WDS.
Spacing Tokens
Sistema de espaçamento baseado em 4px.
Border Radius
Raios de borda do WDS.
Shadow Tokens
Sistema de sombras e profundidade.
Glass System
Camadas de glassmorphism do WDS.
Glow System
Efeitos de brilho por cor e intensidade.
Motion Tokens
Durações e curvas de animação do WDS.
Duration
Curves
Elevation
Níveis de elevação e profundidade.
Z-Index
Hierarquia de camadas e profundidade.
Icon Tokens
Tamanhos padronizados de ícones.
Layout Tokens
Containers, grid e espaçamentos de layout.
Responsive Tokens
Breakpoints e dispositivos suportados.
Watch
< 320px
Mobile
320 — 767px
Tablet
768 — 1023px
Notebook
1024 — 1439px
Desktop
≥ 1440px
Export Structure
Como os tokens fluem do design ao código.
Roadmap
Progresso do WDS — do fundamento à governança.