# Cores

## Funcionamento

Todas as cores derivam de [Tokens Primitivos de Cores](/content/422eaf716/p/336c19/index.html), que foram definidos no projeto. De forma a tornar a gestão do White Label mais facilitada, recomendamos adicionar mais tons de cores nos tokens primitivos antes de re-definir as variáveis no projeto.

Caso haja a necessidade de mais variações, o uso de sufixos como **_Light_** e **_Dark_** é muito bem vindo.

## Foundation

Base das cores escolhidas a partir dos tokens primitivos de cores.

| Foundation        | Color               |
|-------------------|---------------------|
| accent            | {Pink.Pink - 300}   |
| accentLight       | {Pink.Pink - 100}   |
| brandA           | {Purple.Purple - 300}|
| brandB           | {Blue.Blue - 300}   |
| brandC           | {Yellow.Yellow - 300}|
| brandD           | {Orange.Orange - 300}|
| brandE           | {Pink.Pink - 300}   |
| negative          | {Red.Red - 100}     |
| neutralPrimary    | {Neutral.black}     |
| neutralSecondary  | {Neutral.white}     |
| positive          | {Green.Green - 300} |
| warning           | {Yellow.Yellow - 400}|

## Core

Desdobramento das cores utilizadas em aplicações mais práticas: