Capítulo 03 · Identidade

Paleta Cromática

Seis cores. Nem uma a mais. Sem acentos semânticos clássicos — vermelho, verde e amarelo não existem nesta marca.

Cores fundamentais

Clique em qualquer cor para copiar o hex.

Paper

#F2EEE3

Fundo principal. A cor do silêncio.

Clique para copiar

Olive Deep

#3D3D1B

Texto, símbolo, headlines.

Clique para copiar

Olive

#6B6A2E

Marca, links, ações primárias.

Clique para copiar

Olive Light

#B8BA68

Modo escuro, destaques sutis.

Clique para copiar

Ink

#1A1B17

Modo escuro, contraste profundo.

Clique para copiar

Stone

#888780

Metadados, timestamps, silêncio.

Clique para copiar

Aliases semânticos

Em código, use sempre os aliases. Eles abstraem light/dark mode automaticamente.

Token Light Dark Uso
--omn-bgPaperInkBackground principal
--omn-bg-altPaper SoftInk SoftSeção, blocos inset
--omn-fgOlive DeepBoneTexto principal
--omn-fg-softStone SoftBone SoftTexto secundário
--omn-fg-metaStoneStone DarkEyebrows, metadados
--omn-accentOliveOlive LightMarca, links, ações
--omn-borderPaper EdgeInk SoftBordas, divisores

Regras absolutas

  • Sem gradiente. Cor sólida, sempre.
  • Sem sombra. A marca é flat. Profundidade vem de tipografia e espaço.
  • Sem cor fora da paleta. Vermelho, amarelo, azul, magenta não existem.
  • Sem opacidade dramática. Opacidade serve hierarquia (70%, 18%), nunca efeito.
  • Modo escuro não inverte automaticamente. Cada cor tem contraparte pensada.

Recursos

Para integrar com Figma, Tailwind ou design system.

↓ palette.json