Cores primitivas
A base de toda a paleta do Arenito, exportadas diretamente do Figma. São os valores brutos que alimentam as cores semânticas.
Escala
A escala vai de 100 (mais claro) a 500/800 (mais escuro) no modo claro. No modo escuro, a escala se inverte automaticamente.
Neutral
Base do sistema. Superfícies, textos, ícones e bordas.
Neutral
100#F6F6F9
200#ECEDF2
300#E6E8EF
400#CED3E2
500#7A839F
600#394360
700#1E2330
800#12151F
Accent
Guiar e chamar a atenção do usuário. Botões, links e foco.
Accent
100#E8EBF7
200#7391FC
300#3F68FB
400#2441A8
500#001047
Green
Indicar sucesso ou que algo está ativo.
Green
100#DDE4D2
200#7ECE17
300#519000
400#2D470A
500#1A2E00
Yellow
Indicar alertas e avisos ao usuário.
Yellow
100#F0E5C1
200#E7BD2C
300#C89B00
400#9F7C04
500#3B2E02
Red
Indicar erros, urgências e ações destrutivas.
Red
100#F9E1E1
200#F17777
300#C90A0A
400#970707
500#240000
Special
Cores absolutas que não se invertem no dark mode.
| Variável | Valor | Uso |
|---|---|---|
--white | #FFFFFF | Branco absoluto |
--black | #000000 | Preto absoluto |