A paleta de cores deste site foi inspirada em imagens da revista Akira, quando procurava um tema urbano me deparei com imagens de camadas de cores intricadas, que passam a ideia de profundidade e ao mesmo tempo destaque no ponto focal. Peceba que as cores frias ficam ao fundo e as vividas no destaque.
No WordPress, podemos adicionar nossas cores em Global Colors, que pode ser acessado de forma rápida ao definir as cores do Tema.
Além disso, costumo adicionar minhas cores no arquivo Global.css do Tema, o que é especialmente útil quando estou editando HTML pelo plugin Elementor, vinculando as cores por meio de variáveis globais.
Declare suas cores globalmente no css conforme o exemplo abaixo:
Declaração das variáveis globais no CSS Global :
|
1 2 3 4 5 6 7 8 9 10 11 |
:root{ --A1:#ffffff; --A2:#e9d1bf; --A3:#ceb69c; --A4:#8d6969; --I1:#EBD3F8; --I2:#C8A1E0; --I3:#AD49E1; --I4:#7A1CAC; } |
}
Fazendo uso das variáveis globais no CSS de cada Pagina HTML:
|
1 |
.subtitulo{<br /> background-color: var(--I4)}; |
Veja mais no site do Maujor.com
No React e Next.js também existe um Global.css e podemos acessar da mesma forma as cores quando criamos páginas e componentes.
Na imagem acima as cores nos transmite um frescor.
A imagem acima em tons de vermelho e laranja nos transmite muita energia e força,
Portanto a cor transmite uma emoção e se pretendemos entender que emoção transmitimos com nossa paleta, devemos estudar a Psicologia das Cores isso tem relação direta com Marketing;
Agora , conhecendo o seu público alvo, crie um tema e uma paleta adequado ao seu público.