# Paleta do SEED Design System — as rampas (v1.23)

Fonte: https://ds.seed.eng.br/02-tokens/seed-tokens.json · dez tons por família; âncora = hex canônico da marca, preservado exato.

## turquesa

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| 50 | #E8FBF7 | --seed-turquesa-50 |  |
| 100 | #CDF3EC | --seed-turquesa-100 |  |
| 200 | #9CE4D8 | --seed-turquesa-200 |  |
| 300 | #66D1C2 | --seed-turquesa-300 |  |
| 400 | #11B0A0 | --seed-turquesa-400 | ANCORA CANONICA #11B0A0 - cor principal da marca (Pantone 3275C) |
| 500 | #00A192 | --seed-turquesa-500 |  |
| 600 | #098475 | --seed-turquesa-600 | ANCORA CANONICA #098475 - verde institucional (Pantone 327C); stop de acao acessivel: 4.60:1 com branco |
| 700 | #006C62 | --seed-turquesa-700 |  |
| 800 | #005048 | --seed-turquesa-800 |  |
| 900 | #00352F | --seed-turquesa-900 |  |

## amarelo

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| 50 | #FFF6D2 | --seed-amarelo-50 |  |
| 100 | #FDEA9E | --seed-amarelo-100 |  |
| 200 | #FAD61D | --seed-amarelo-200 | ANCORA CANONICA #FAD61D - amarelo da marca (Pantone 115C); ACENTO OFICIAL de marca (highlight, EEny, simbolo); sempre com texto escuro; nunca na mesma peca que o dourado |
| 300 | #DABA00 | --seed-amarelo-300 |  |
| 400 | #BDA100 | --seed-amarelo-400 |  |
| 500 | #A28A00 | --seed-amarelo-500 |  |
| 600 | #877200 | --seed-amarelo-600 |  |
| 700 | #6D5C00 | --seed-amarelo-700 |  |
| 800 | #504300 | --seed-amarelo-800 |  |
| 900 | #352C00 | --seed-amarelo-900 |  |

## dourado

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| 50 | #FFF4E4 | --seed-dourado-50 |  |
| 100 | #FFE6C0 | --seed-dourado-100 |  |
| 200 | #FECA76 | --seed-dourado-200 |  |
| 300 | #F9B11C | --seed-dourado-300 | ANCORA CANONICA #F9B11C - amarelo dourado (Pantone 7409C); COR DE TRABALHO: warning, dataviz (cat-2), detalhe fotografico - fora de pecas de marca; nunca na mesma peca que o amarelo |
| 400 | #D49400 | --seed-dourado-400 |  |
| 500 | #B67F00 | --seed-dourado-500 |  |
| 600 | #986900 | --seed-dourado-600 |  |
| 700 | #7B5500 | --seed-dourado-700 |  |
| 800 | #5B3E00 | --seed-dourado-800 |  |
| 900 | #3D2800 | --seed-dourado-900 |  |

## azul

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| 50 | #ECF4FC | --seed-azul-50 | ANCORA CANONICA #ECF4FC - antigo 'azul claro' da paleta (Pantone 656C), absorvido como stop 50 |
| 100 | #CDF1FF | --seed-azul-100 |  |
| 200 | #96E0FD | --seed-azul-200 |  |
| 300 | #53C2E9 | --seed-azul-300 | ANCORA CANONICA #53C2E9 - azul da marca (Pantone 2985C). Papel formal: familia de INFO na interface, cat-3 no dataviz, badges/tags informativos, ceu/agua em ilustracao. Livre no produto digital; contido em material de marca (nao compete com turquesa em titulos/fundos/CTAs). Acao primaria e sempre familia turquesa/verde - nunca azul |
| 400 | #01B3E0 | --seed-azul-400 |  |
| 500 | #0099C1 | --seed-azul-500 |  |
| 600 | #007FA1 | --seed-azul-600 |  |
| 700 | #006783 | --seed-azul-700 |  |
| 800 | #004C61 | --seed-azul-800 |  |
| 900 | #003241 | --seed-azul-900 |  |

## cinza

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| 50 | #F2F6F9 | --seed-cinza-50 |  |
| 100 | #E3EBF0 | --seed-cinza-100 |  |
| 200 | #C8D6DF | --seed-cinza-200 |  |
| 300 | #ACBECA | --seed-cinza-300 |  |
| 400 | #90A6B3 | --seed-cinza-400 |  |
| 500 | #788F9D | --seed-cinza-500 |  |
| 600 | #617683 | --seed-cinza-600 | ANCORA CANONICA #617683 - cinza da marca (Pantone 5487C); corpo de texto minimo em fundo claro (4.74:1) |
| 700 | #4D606C | --seed-cinza-700 |  |
| 800 | #38464F | --seed-cinza-800 |  |
| 900 | #242E34 | --seed-cinza-900 |  |

## vermelho

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| 50 | #FFF2F1 | --seed-vermelho-50 |  |
| 100 | #FFE2DF | --seed-vermelho-100 |  |
| 200 | #FFC2BD | --seed-vermelho-200 |  |
| 300 | #FF9C95 | --seed-vermelho-300 |  |
| 400 | #FC6F6A | --seed-vermelho-400 |  |
| 500 | #D94545 | --seed-vermelho-500 | ANCORA #D94545 - vermelho funcional (nao e cor de marca; formalizado a partir do uso previo no DS digital) |
| 600 | #C6393B | --seed-vermelho-600 |  |
| 700 | #A5272A | --seed-vermelho-700 |  |
| 800 | #7A1C1E | --seed-vermelho-800 |  |
| 900 | #521112 | --seed-vermelho-900 |  |

## dark

| tom | hex | variável CSS | âncora |
|---|---|---|---|
| page | #0B1419 | --seed-dark-page |  |
| default | #141D23 | --seed-dark-default |  |
| elevated | #1D272D | --seed-dark-elevated |  |
| overlay | #273137 | --seed-dark-overlay |  |