-color-contrast são calculadas automaticamente pelo Rocket para garantir contraste adequado sobre o --background-color configurado na loja.
| Variável | Valor | Descrição |
|---|---|---|
--white | Branco puro. | |
--white-smoke | Cinza muito claro. | |
--black-dark | Quase preto. Cor principal de texto. | |
--black-dark-rgb | 34, 34, 34 | Valor RGB de --black-dark, para uso em rgba(). |
--black-dark-color-contrast | Calculado | Versão contrastante de --black-dark sobre o fundo da loja. |
--black-medium | Cinza médio. Textos secundários. | |
--black-medium-color-contrast | Calculado | Versão contrastante de --black-medium sobre o fundo da loja. |
--black-light | Cinza claro. Textos auxiliares e placeholders. | |
--black-light-30 | Cinza claro com 30% de opacidade. | |
--black-light-color-contrast | Calculado | Versão contrastante de --black-light sobre o fundo da loja. |
--black-lightest | Cinza bem claro. Bordas e divisores. | |
--black-lightest-color-contrast | Calculado | Versão contrastante de --black-lightest sobre o fundo. |
--background-contrasting-color | Calculado | Branco ou preto — o que tiver maior contraste sobre o fundo da loja. |
--green | Verde. Usado em contextos de sucesso. | |
--green-color-contrast | Calculado | Versão contrastante de --green sobre o fundo da loja. |
--neutral-color-low-dark | Cinza-roxo escuro. Títulos de seções e subtítulos. | |
--neutral-color-low-dark-color-contrast | Calculado | Versão contrastante de --neutral-color-low-dark. |
--neutral-color-low-pure | Quase preto. Overlays e modais escuros. | |
--charcoal | Carvão. Elementos de interface escuros. |