Cores

Paleta

Chame pelo nome. Sage é a marca — verde de folhagem seca, não de app; Sage profundo é onde ela mora nas peças; Papel é o chão do painel e o fundo da peça clara; Linho é o detalhe quente. Clique pra copiar o hex.

Primitivas

Os degraus crus que os semânticos usam. No componente, use o semântico, não a primitiva.

Sage — a única rampa autoral

OKLCH, ancorada em #769382 (500). Croma baixíssimo, pico 0.041. O matiz desliza de 155 nos claros a 169 nos escuros pra os tons profundos não empapuçarem em musgo. O primary é o 700 no claro (7,2:1 com branco) e o 400 no escuro.

Stone — o cinza quente

O stone do Tailwind, sem mexer. Texto, borda e fundo saem daqui; o bege da tela é a temperatura dele, não uma segunda rampa competindo com o verde.

Semânticos

Tokens do Nuxt UI que invertem no escuro — troque o tema pra ver. É o que se escreve no componente, nunca o hex da paleta.

Ação e estado

Sucesso é a própria sage: um segundo verde ao lado do da marca lê como erro de tema. secondary é stone — destaque secundário aqui é silêncio.

Superfície

Invertido em relação ao padrão do Nuxt UI: chão stone-100, card branco. O card "flutua" sobre o stone — é o que dá o ar premium. Card padrão: bg-default shadow-xs.

Texto

Um degrau acima do padrão em cada nível: sobre stone-100 o stone-500 cai pra 4,4:1; com 600 vai a 7,0:1.

Borda

Agenda

Seis cores, dois papéis cada. O verde não é uma sétima cor: é a rampa sage. As outras cinco são o mesmo degrau com o matiz girado — luminosidade e croma iguais, então o olho lê as seis com o mesmo peso. A marca é a bolinha e o fio; o lavado é o fundo da tarja. Só na agenda: fora dela, cor é semântica.

Combinações

Texto sobre fundo, com a razão de contraste calculada. Texto passa pra corpo (4,5:1), só título passa a partir de 24px (3:1). Par que não está aqui não se usa.