capítulos do manual
fundamentos
aplicação
As cores
Base neutra, os dois sinais, os estados semânticos, o tema escuro e a proporção de tela.
token
O princípio
A base não tem cor: papel claro e uma tinta quente, #14120F, que nunca é preto puro. Sobre ela entram dois sinais, terracota para pessoas e cobalto para inteligência artificial, e mais nada.
O cobalto é a cor mais protegida do sistema. Quando ele passa a ser usado como cor de link ou de destaque, o cliente perde a única referência confiável para saber que está lendo uma máquina.
Verde, vermelho e âmbar entram por significado: verde para concluído, conectado e saudável; vermelho para perigo real, como excluir, sair, erro de validação e canal fora do ar; âmbar para pendência que ainda não é erro. Usar vermelho como destaque gasta a única palavra que o sistema tem para dizer perigo.
O azul da SAN, #007BFF, fica fora da interface do produto: ele colide com o cobalto. O lugar dele é o selo de procedência.
Proporção
A tela é quase toda neutra: cerca de 60% papel, 25% tinta, e o restante dividido entre os dois sinais. Uma tela majoritariamente terracota ou cobalto está errada mesmo usando as cores certas.
60% papel · 25% tinta · 9% cobalto · 6% terracota
Paleta
base
papel e tinta carregam cerca de 85% de qualquer tela
papel
#FFFFFF
apoio
#F6F6F4
linha
#E4E4E0
tinta
#14120F
grafite
#2B2823
rótulo
#5A5448
névoa
#8D8779
sinais
terracota é o lado das pessoas, cobalto é o da IA; o destaque serve quando não há encontro
equipe
#EB5E28
véu equipe
#FBDED2
texto equipe
#B23F14
ia
#2667FF
véu ia
#DCE6FF
texto ia
#1A4FD6
destaque
#7FA3FF
estados
entram por significado, cada um com um véu de fundo e um tom de texto
concluído
#1F9D55
véu ok
#E8F6EE
perigo
#C0341D
véu erro
#FBE3DC
pendência
#B7791F
véu atenção
#FBEED2
tema escuro
os sinais clareiam para manter contraste sobre tinta; nunca reaproveitar o tom claro
página
#14120F
card
#1D1A16
borda
#2B2823
equipe
#F58E63
ia
#7DA2FF
concluído
#5BD78F
texto
#B9B2A2