Ir ao conteúdo
SEED engenhariaDesign System

E-mail

4. EM1 — camada de tokens resolvidos

seed-email.md v0.13 · §04seção 7 de 1704-em1-camada-de-tokens-resolvidos.md · MD5 d3d00545

Decisão: o e-mail consome hex literal, resolvido a partir do seed-tokens.md v1.2 por script, publicado como seed-tokens-email.json. Nenhum var() no output. Token consumido sem definição continua sendo bug de build, reprovado na suíte.

Racional: ver seção 1. É o padrão da indústria — provedores de e-mail mantêm transformadores que substituem variáveis pelos valores justamente para ampliar a compatibilidade.

Alternativas descartadas:

  • var() com valor de fallback — o Gmail não declara a variável, então o resultado é imprevisível entre clientes; um fallback que funciona em teste pode falhar em produção.
  • Paleta duplicada e mantida à mão — produz deriva garantida entre o e-mail e o resto do sistema, que é exatamente o problema que o DS existe para matar.

4.1 Paleta resolvida (subconjunto e-mail)#

Todos os hex vêm das rampas do seed-tokens.md v1.2 §2.1. Nenhum foi inventado aqui.

Papel no e-mail Hex Origem no token
Canvas (fundo externo da mensagem) #F2F6F9 cinza-50
Superfície (fundo do card) #FFFFFF branco
Marca profunda (cabeçalho/rodapé) #005048 turquesa-800
Marca alternativa #006C62 turquesa-700
Ação primária (fundo do botão) #098475 turquesa-600
Texto primário #242E34 cinza-900
Texto secundário #4D606C cinza-700
Texto sutil (dentro do card) #617683 cinza-600
Link #006C62 turquesa-700
Divisor / borda #C8D6DF cinza-200
Sucesso — texto / fundo #005048 / #E8FBF7 turquesa-800 / turquesa-50
Erro — texto / fundo #A5272A / #FFF2F1 vermelho-700 / vermelho-50
Atenção — texto / fundo #5B3E00 / #FFF4E4 dourado-800 / dourado-50
Informação — texto / fundo #004C61 / #ECF4FC azul-800 / azul-50

4.2 Contraste medido (não herdado)#

Medido por contraste-email.py em 2026-08-07. 14 pares com piso, 0 reprovações.

Papel Razão Veredicto
Texto primário sobre corpo branco 13.86 AAA
Texto secundário sobre corpo 6.55 AA
Texto sutil sobre corpo 4.74 AA
Link sobre corpo 6.32 AA
Texto primário sobre canvas 12.75 AAA
Texto de rodapé sobre canvas 6.03 AA
Botão primário (branco sobre turquesa-600) 4.60 AA
Texto inverso sobre marca-800 9.37 AAA
Texto inverso sobre marca-700 6.32 AA
Sucesso 8.73 AAA
Erro 6.58 AA
Atenção 9.05 AAA
Informação 8.57 AAA

Por que remedir em vez de herdar os números do seed-tokens.md: os fundos do e-mail não são os mesmos da interface. O caso que provou a necessidade está registrado como errata abaixo.

ERRATA v0.1 — rodapé legal. A primeira versão desta tabela usava cinza-600 para o texto de rodapé sobre o canvas cinza. Medido: 4.37, que reprova o piso AA de 4.5. O mesmo cinza-600 passa com folga sobre branco (4.74) — o fundo cinza consome a margem. Correção aplicada: rodapé sobre canvas usa cinza-700, medido em 6.03. Se os números tivessem sido herdados da interface em vez de medidos, o erro teria entrado em todos os templates da fase.

4.3 Isenção declarada — elementos decorativos#

Divisor e borda de card foram medidos e isentados do piso de 3:1:

Elemento Razão medida
Borda de card sobre canvas 1.37
Divisor sobre corpo 1.49

Racional: o critério WCAG 1.4.11 se aplica a componentes de interface e a objetos gráficos necessários para entender o conteúdo. Um divisor que apenas reforça uma separação já sustentada por espaçamento e por troca de fundo não carrega informação: se sumir por completo, o e-mail continua compreensível e navegável.

Evidência de que escurecer não era a saída: medimos os stops disponíveis — cinza-200 = 1.49, cinza-300 = 1.91, cinza-400 = 2.53 sobre branco. Nenhum stop utilizável alcança 3:1. Chegar lá exigiria cinza-600, transformando um detalhe em traço pesado e contrariando o princípio "assinatura, não cobertura" (marca-seed.md v5.0 §2).

Condição da isenção (gatilho de revisão): se algum dia um divisor passar a ser o único indicador de uma fronteira — sem espaçamento, sem troca de fundo — ele deixa de ser decorativo e volta a exigir 3:1.


Esc