capítulos do manual

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