Wake Typography System®
Uma única linguagem tipográfica para todos os produtos do Ecossistema Wake Hub.
Tipografia é linguagem.
A tipografia não organiza apenas palavras. Ela organiza pensamento, hierarquia, leitura, experiência e confiança. Toda comunicação da Wake Hub deverá transmitir clareza, sofisticação e precisão.
Clareza
Comunicação direta sem ambiguidade.
Elegância
Sofisticação em cada detalhe tipográfico.
Legibilidade
Leitura confortável em qualquer dispositivo.
Escalabilidade
Escala para milhares de superfícies sem perda.
Famílias Tipográficas
As fontes oficiais do Ecossistema Wake Hub.
Inter
Fonte de interface para todo o ecossistema. Altamente legível em pequenas e médias dimensões.
Space Grotesk
Fonte display para títulos e headlines. Personalidade geométrica moderna e premium.
JetBrains Mono
Fonte monoespaçada para código, dados técnicos e documentação técnica.
Escala Tipográfica
A hierarquia completa do Wake Typography System.
Peso das Fontes
A escala de pesos do Inter.
Line Height
Altura de linha por contexto de leitura.
Densidade alta. Headers, labels, dados.
A tipografia organiza pensamento, hierarquia e experiência em cada palavra do ecossistema Wake Hub.
Equilíbrio. UI text, descrições curtas.
A tipografia organiza pensamento, hierarquia e experiência em cada palavra do ecossistema Wake Hub.
Conforto de leitura. Body text padrão.
A tipografia organiza pensamento, hierarquia e experiência em cada palavra do ecossistema Wake Hub.
Artigos, blog, documentação longa.
A tipografia organiza pensamento, hierarquia e experiência em cada palavra do ecossistema Wake Hub.
Letter Spacing
Espaçamento entre letras por contexto.
Headlines grandes e display
Body text padrão
Labels e form fields
Títulos e heroes
UI components
CTAs e ações
Tags e badges
Comprimento de Linha
O impacto da largura de linha na leitura.
A tipografia de qualidade organiza pensamento e transmite confiança em cada palavra do produto digital.
A tipografia de qualidade organiza pensamento e transmite confiança em cada palavra do produto digital.
A tipografia de qualidade organiza pensamento e transmite confiança em cada palavra do produto digital.
A tipografia de qualidade organiza pensamento e transmite confiança em cada palavra do produto digital.
Alinhamentos
Quando utilizar cada alinhamento.
Esquerda
Padrão para body text, interface e leitura.
Sempre que possívelCentro
Headlines, heros e CTAs curtos.
Destaques e heroesDireita
Números, datas, valores em tabelas.
Dados tabularesJustificado
Editorial, print, materiais formais.
Raramente digitalContraste
Padrões de contraste para acessibilidade WCAG.
Tipografia Responsiva
A escala se adapta por dispositivo.
TV
Desktop
Notebook
Tablet
Mobile
Watch
Exemplos Reais
Aplicação do WTS nos produtos do ecossistema.
Landing Page
Hero + BodyDashboard
Data + UICRM
Table + FormClient Center
PortalLEVE
ProdutoNEXUS
InteligênciaW CITY
ProdutoAplicativo
MobileBlog
EditorialPlayground
Experimente a tipografia em tempo real.
Controles
Preview
A tipografia organiza o pensamento.
Exportação
Como a tipografia flui do design ao código.
Roadmap
Progresso do WDS — do fundamento à governança.