4 cores
Clique em uma cor para copiar o código.
Cores
Paleta
de cores
Clique na cor para copiar o HEX.
Roxo base
#3D2B6B
Base do fundo
HEX
#3D2B6B
RGB
61 43 107
Roxo do gradiente
#5B3E9E
Gradiente do fundo
HEX
#5B3E9E
RGB
91 62 158
Rosa destaque
#E84393
Palavras e frases em destaque
HEX
#E84393
RGB
232 67 147
Branco
#FFFFFF
Cards, logo e textos sobre o fundo
HEX
#FFFFFF
RGB
255 255 255
Fundo dos posts
Gradiente do fundo
#3D2B6B → #5B3E9E
Cores
Contraste
das combinações
Quanto cada combinação de cor se lê bem.
Combinação
Contraste
Aa
Branco sobre o roxo base
11,96:1
Qualquer texto
Aa
Branco sobre o roxo do gradiente
7,99:1
Qualquer texto
Aa
Roxo base sobre o branco (cards)
11,96:1
Qualquer texto
Aa
Rosa sobre o roxo base
3,22:1
Só texto grande
Aa
Rosa sobre o branco (cards)
3,71:1
Só texto grande
Aa
Rosa sobre o roxo do gradiente
2,15:1
Evitar
Texto grande: a partir de 24 px, ou 19 px em negrito (regra WCAG). Nos posts de 1080 px quase todo título passa disso.
Cores
Regras
de uso
Onde entra cada cor.
Rosa só no destaque
Palavras e frases em destaque. Nunca em parágrafos inteiros.
Rosa na parte escura
No fim claro do gradiente o rosa some (2,15:1). Deixe o destaque onde o fundo é mais escuro.
Branco para o resto
Cards, logo e todo texto sobre o fundo. Texto pequeno é sempre branco.
As quatro cores em variáveis CSS