Paleta
Cores
Paleta única da marca, sem modo claro. Fundo escuro predominante, dourado como acento, nunca como fundo de bloco grande. Ver também Princípios e proibições.
Dourado
rgb(212, 175, 55) · var(--color-dourado)
Ouro claro
rgb(242, 212, 122) · var(--color-ouro-claro)
Preto (fundo)
rgb(10, 10, 10) · var(--color-fundo)
Grafite
rgb(26, 26, 26) · var(--color-grafite)
Branco (texto)
rgb(255, 255, 255) · var(--color-texto)
Erro
rgb(192, 57, 43) · var(--color-erro)
Variações de opacidade
Tons intermediários usados o tempo todo na interface, sempre como fração de opacidade de um token já existente, nunca como cor nova.
dourado/10
Hover e fundo sutil de item ativo
dourado/20
Borda padrão de Card e divisores
dourado/40
Borda em estado ativo/selecionado
texto/70
Parágrafo e texto secundário
texto/50
Legenda e metadado
texto/40
Rótulo auxiliar (uppercase, tracking largo)
Quando usar cada cor
| Cor | Onde usar | Onde não usar |
|---|---|---|
| Dourado / Ouro claro | Acento: título, ícone ativo, borda de destaque, botão principal | Fundo de bloco grande, texto corrido extenso |
| Preto (fundo) | Fundo de página, base de todo o site | Texto sobre fundo já escuro |
| Grafite | Fundo de Card, painel lateral, superfície elevada sobre o preto | Fundo de página inteira |
| Branco (texto) | Corpo de texto, título sobre fundo escuro | Grandes áreas sólidas (vira excesso de contraste) |
| Erro | Ação destrutiva (remover, cancelar cadastro), alerta crítico | Qualquer uso decorativo ou de destaque positivo |
Cores para impressão
Na tela, a cor é definida em hex. Na impressão, a gráfica trabalha com Pantone (a tinta exata) ou CMYK (impressão em quatro cores). Esta é a referência para qualquer peça impressa da marca: camiseta, álbum, convite, banner. O dourado do logotipo é o par do gradiente metálico, diferente do dourado de interface acima.
| Cor | Tela | Pantone | CMYK | Uso |
|---|---|---|---|---|
Preto | #0A0A0A | A definir | A definir | Fundo de peça e texto sobre fundo claro |
Branco | #FFFFFF | A definir | A definir | Texto e grafismo sobre fundo escuro |
Dourado metálico | #DBC7AC até #633A0C | A definir | A definir | Logotipo e grafismos em impressão que reproduz degradê (digital, DTF, sublimação) |
Dourado sólido | A definir | A definir | A definir | Logotipo em silk e bordado, que trabalham com cor chapada |
O código Pantone é escolhido com a escala física ou numa prova com a gráfica: converter o hex da tela não garante a mesma cor, e tinta metálica não tem equivalente exato em tela. Silk e bordado trabalham com cor chapada, por isso o logotipo precisa do dourado sólido nessas técnicas.