Ir ao conteúdo
SEED engenhariaDesign System

Marca SEED

3. Cores

marca-seed.md v5.37 · §03seção 4 de 1903-cores.md · MD5 2462865c

3.1 As 8 cores canônicas (hex intactos desde 2018) + referências de impressão#

Cor HEX Pantone CMYK (C — sup. brilhante) Papel na v5.0
Turquesa #11B0A0 3275C 75 0 45 0 Cor principal; assinatura da marca
Branco #FFFFFF 0 0 0 0 Cor dominante das peças (~70%)
Amarelo #FAD61D 115C 4 13 90 0 Acento oficial (grifos, EEny, símbolo)
Verde #098475 327C 83 25 58 9 Ação primária digital; profundidade
Cinza #617683 5487C 63 41 35 19 Texto e neutros
Amarelo Dourado #F9B11C 7409C 0 35 91 0 Cor de trabalho (warning, dataviz)
Azul #53C2E9 2985C 62 0 5 0 Família de info na UI; contido na marca
Azul Claro #ECF4FC 656C 12 0 1 0 Fundos suaves (= azul-50 da rampa)

Pantone/CMYK resgatados do Manual de Identidade Visual 2018 (v1.0, DSDG). CMYK "U" (superfície fosca): o manual previa e não preencheu — (a confirmar) se houver impressão fosca com fidelidade crítica.

Errata registrada (2026-07-30): o manual 2018 lista para o Azul Claro RGB 230 244 252 (= #E6F4FC) e HEX #ECF4FC — valores inconsistentes entre si. Decisão do Rafael: #ECF4FC é o canônico (é o que todo o material digital usa); o RGB do manual fica registrado como errata.

Vermelho funcional #D94545: não é cor de marca. Existe para estados de erro/perigo em interface e dataviz negativa (rampa completa nos tokens). Proibido em material de marca (posts, capas, propostas).

3.2 Rampas tonais — onde vivem os tons#

Cada cor virou uma rampa de 10 tons (50→900) gerada em OKLCH com os canônicos ancorados exatos — fundos sutis, hovers, escuros premium, tudo derivado sem tocar nos hex de 2018. Valores e método: seed-tokens.md §2 (v1.1). Três fatos úteis no dia a dia:

  • O verde #098475 é o turquesa-600 da rampa — e é o tom de ação acessível (4.60:1 com branco).
  • O azul-claro #ECF4FC é o azul-50 — o "fundo suave" oficial.
  • O escuro premium da marca é o turquesa-800 #005048 / turquesa-900 #00352F — para capas profundas, use surface-brand-deep (turquesa-700/800). Supersede: a variante não-oficial #0d8f82 está aposentada.

3.3 Hierarquia de uso — a lei 70/20/10#

Supersede a regra de 2018 de "45% de turquesa na identidade" — causa raiz das peças cobertas de onda (o "efeito infantil" que este rebranding mata).

  • ~70% branco e neutros claros (branco, cinza-50, azul-50). O respiro é o fundo padrão.
  • ~20% família turquesa — majoritariamente em tons da rampa (fundos 50/100, textos 600/700, escuros 800/900); o #11B0A0 chapado é assinatura, não forração.
  • ~10% acentos — amarelo, dourado, azul e escuros, cada um no seu papel.

Quatro esclarecimentos de aplicação (para a regra não virar burocracia nem ser burlada):

  1. É hierarquia visual, não régua de pixels. Ninguém mede área; o teste é de olho: um campo calmo dominante, a cor da marca estruturando, o acento escasso. Se o acento aparece em tudo, nada destaca.
  2. Fotografia conta como campo dominante. Numa peça fotográfica (capa com foto de usina, post de obra), a foto pode ocupar 80% — a ordem se mantém: foto/neutro > turquesa > acento.
  3. O erro clássico que a regra existe pra impedir: tratar a cor da marca como o campo dominante. O dominante é o neutro; a marca é a camada estrutural.
  4. A regra é contrato de engenharia via tokens: nos produtos, componentes não introduzem uma quarta família saturada sem revisão de design — os semânticos já codificam a hierarquia.

3.4 Hierarquia dos amarelos (decisão 2026-07-30)#

Os dois amarelos distam ~25° de matiz; usados de forma intercambiável, liam como inconsistência. Agora:

  • Amarelo #FAD61D = acento oficial de marca. Grifos, marcadores de ênfase, o amarelo do EEny e do símbolo. Token: accent-highlight.
  • Dourado #F9B11C = cor de trabalho. Warning na interface, cat-2 do dataviz, detalhe fotográfico. Fora de destaque de marca.
  • Nunca os dois na mesma peça.

3.5 Papel do azul (decisão 2026-07-30, mal-entendido resolvido em registro)#

  • No produto digital: livre e empregado. É a família de info (banners, badges, estados informativos), cat-3 do dataviz, tags, céu/água em ilustração.
  • Em material de marca: contido. Fora de títulos, fundos de peça e CTAs, onde compete com o turquesa.
  • Ação primária é sempre família turquesa/verde — nunca azul. Botão azul é a convenção de quem não tem cor própria de ação; a SEED tem (#098475, AA). Registro: a contenção do azul nunca se aplicou a sistemas — só a peças de marca.

3.5-b Registro de 2026-08-13 — a régua de ação foi CONFIRMADA, e a âncora de ênfase nasce#

Contexto, porque sem ele este registro parece redundante. Em 2026-08-13, durante a produção do §48 (Painel) do design system, uma régua de ação alternativa foi proposta e chegou a viver num preview: a ação deixaria de ter cor própria e passaria a usar o "escuro estrutural" da tela, que naquele momento era azul-800 #004C61. A proposta conflitava frontalmente com o §3.5 acima e foi registrada como conflito declarado, pendente de decisão de marca — jamais aplicada ao canônico.

A proposta foi RETIRADA no mesmo dia, e o §3.5 permanece vigente e intocado. O motivo não foi preferência: a caixa de ênfase do painel passou a ser turquesa vivo em vez de escura, e com isso a ação voltou naturalmente à família da marca. Conferido nos gêmeos de token: o action-primary sempre foi #098475 no tema claro e #66D1C2 no escuro. A camada de tokens nunca saiu desta regra — apenas um preview havia desviado.

Fica registrado para quem encontrar o rastro: se você achar num artefato antigo um botão primário em azul-800, é resíduo daquela proposta retirada, não decisão de marca. O hex de ação é o #098475 que o §3.5 nomeia.

3.5-c ÂNCORA DE ÊNFASE — uma por página, cromática (nova em 2026-08-13)#

Regra: toda página de produto tem UMA caixa de ênfase, e ela é cromática, não escura. Base turquesa-400 #11B0A0 (L 33,71%, croma 0,624), tinta única turquesa-900 #00352F (4,99 — piso 4,5), anel turquesa-600 (4,60 contra a página, obrigatório porque a base contra o branco mede 2,71 e reprova o piso de fronteira de 3,0) e véu de luz turquesa-300 a 35% no canto onde o texto vive (ΔL 5,84 pontos, dentro da faixa de 4–6 do mecanismo P1 medido no estudo-viver-de-ia.md).

Três reprovações que fecham as alternativas, todas medidas: descer a base um degrau para turquesa-500 derruba a tinta a 4,20 · a ação em pílula branca dentro da âncora mede 2,71 de fronteira e reprova · o itálico do sujeito não pode ser marcado por cor (branco 2,71 · amarelo-200 1,90 · turquesa-100 3,36), e passa a ser marcado por forma e peso — mecanismo que, ao contrário da cor, sobrevive ao grayscale.

Dentro da âncora a hierarquia inverte: ação primária é pílula turquesa-800 + branco (texto 9,37 · fronteira 3,45); secundária é ghost da própria tinta. O amarelo não entra na âncora (1,90).

Por que a âncora deixou de ser escura, em uma frase: o diagnóstico foi luminância, não matiz — a versão escura media L 6,03% contra 33,71% da atual, e nenhuma quantidade de croma corrige uma caixa quase preta.

3.5-d TINTA DE TEXTO na família da marca (nova em 2026-08-13)#

text-primary, text-secondary e text-muted passam da família cinza para a família turquesa — apenas o texto. Bordas e superfícies permanecem NEUTRAS e a página permanece BRANCA, porque é o que a referência medida faz (estudo-viver-de-ia.md §2.1: tinta em croma 0,192, bordas em 0,027/0,031, página em branco puro) e porque a âncora do §3.5-c é cromática — esverdear a superfície roubaria dela o contraste de saturação que a faz existir.

Valores e medições completas vivem no seed-tokens.md v1.9, com o supersede formal da restrição de hex novo. Os 8 hex canônicos da paleta 2018 seguem intocados: a tinta entra como valor semântico, nunca como primitivo.

3.6 Regras de contraste (reformuladas com medição — supersede as regras sem número da v4.1)#

  • Branco sobre turquesa #11B0A0 = 3.22:1 → permitido APENAS ≥24px ou ≥19px bold (AA-large). Texto funcional/normal sobre fundo turquesa: usar surface-brand-deep ou o par de ação (turquesa-600+).
  • Branco sobre verde #098475 = 4.60:1 → AA para qualquer tamanho. É o fundo de botão primário.
  • Amarelo #FAD61DSEMPRE texto escuro (cinza-900 #242E34, 9.70:1). Nunca branco. Idem dourado (7.48:1 com cinza-900).
  • Corpo de texto em fundo claro: mínimo cinza-600 #617683 (4.74:1); preferencial cinza-700 (6.55:1). Cinza-500 só para metadados/placeholder.
  • Auditoria completa (14 pares): seed-tokens.md §5.

3.6-b Admissão de cor de entidade — estável · gate visual do Rafael aprovado em 2026-08-14 (G3 do preview de composição) (SUP-5 de 2026-08-14; dispositivo C21 do confronto de referências)#

É lei de marca, não de token, porque decide o que pode ser cor da SEED. Cor de entidade (área do ERP, cliente, categoria) sai de paleta FECHADA (decisão Q1 do gate de 2026-08-14) e só é admitida se passar 4,5:1 com uma das duas tintas declaradas: entity-ink-dark = cinza-900 #242E34 · entity-ink-light = branco. A verificação acontece na definição da paleta — teste estático, custo zero em render. Precedente interno: a regra do amarelo do §3.6 ("SEMPRE texto escuro") já era uma declaração de tinta-por-cor; esta seção a generaliza.

Medição de 2026-08-14 (6 famílias × 10 stops × 2 tintas, fórmula WCAG 2.1 sobre o seed-tokens.css v1.9) — a lei é limpa e vale para TODAS as famílias:

Faixa de stop Tinta admitida Pior par
50–400 entity-ink-dark (cinza-900) 5,03 ✓
500 NENHUMA — inadmissível (zona de cruzamento de luminância) 4,30 ✗
600–900 entity-ink-light (branco) 4,60 ✓

A paleta de seis posições proposta, os porquês das exclusões e a regra "acima de 6, repete cor e distingue por glifo" estão no seed-composicao.md §7 (CP22/CP23) — este arquivo é dono da LEI de admissão; aquele, do consumo em composição. Alternativa descartada: hex livre com cálculo de luminância em render — instável na zona de cruzamento, custo em render e texto mudando entre chips vizinhos; com paleta fechada, a tabela estática é estritamente melhor.


Esc