Cor

02 Cores primárias

As cores primárias são a base da identidade da Squad22. A turquesa é a cor herói: aparece grande, em fundos e no '22 do logo.

O noturno vem do site e segura textos e fundos escuros. Por acessibilidade, a turquesa nunca entra sobre branco ou papel. Ali o destaque é o rosa ou o azul sinal, nunca os dois na mesma peça. Em texto menor que 24 px sobre claro, use rosa escuro.

02 Cores secundárias

As secundárias dão profundidade e estrutura. O rosa é o complementar da turquesa na roda de cores e assume o lugar dela sempre que o fundo é claro.

Papel e toner vêm da linguagem de copiadora dos posts. O toner é texto de apoio só sobre fundo escuro; sobre claro, use grafite. Azul noite e grafite servem de fundo escuro alternativo. O céu fica no meio do caminho entre a turquesa e o azul sinal na roda de cores (206°) e faz a ponte entre as duas.

02 Cores terciárias

A escala da turquesa tem cinco passos com o mesmo matiz e a mesma saturação, variando só a luminosidade: 90%, 70%, 50%, 35% e 20%.

A escala do azul segue os mesmos cinco passos de luminosidade: 90%, 70%, 58% (azul sinal), 35% e 20%.

02 Cores terciárias

A escala do rosa segue os mesmos passos: 90%, 70%, 60% (rosa), 35% e 20%. Serve para alertas, comparações e para marcar o que mudou. O rosa escuro é a versão para texto pequeno sobre claro.

Os tons do noturno organizam informação em camadas e separam níveis de leitura.

02 Cores neutras

As neutras dão estrutura, contraste e equilíbrio. Elas sustentam primárias e secundárias e servem para tipografia, fundos e elementos de layout que não podem competir com a mensagem.

02 Hierarquia de cor

Hierarquia de cor define qual cor fala primeiro.

A turquesa domina: é a primeira cor que alguém associa à Squad22. Noturno e branco formam a base de leitura. Sobre fundo claro, o rosa ou o azul sinal assume o papel da turquesa, conforme a cor da peça.

Secundárias e terciárias apoiam o conteúdo. Use para diferenciar seções, marcar dados ou chamar atenção para um ponto.

02 Combinações

Combinações de cor reforçam o significado e dão clareza.

Turquesa sobre noturno é a combinação mais forte da marca. Sobre fundos claros, o destaque passa para o rosa ou para o azul sinal: turquesa sobre branco ou papel não tem contraste.

Rosa e turquesa juntos vibram muito: use em pouca área e nunca no logo.

Azul sinal e rosa nunca entram na mesma peça. Cada post escolhe um dos dois e usa do começo ao fim, com o mesmo peso: fundo, destaque e números.

Sempre confira legibilidade e equilíbrio, principalmente com cores saturadas.

02 Roda de cores

Complementar

Turquesa + rosa

Destaque, alerta e o que mudou. O rosa fica a 8° do oposto exato da turquesa, perto o bastante para funcionar como complementar.

Tríade

Turquesa + amarelo + magenta

Três cores a 120° uma da outra. Gráficos e dados com várias séries. O amarelo também é o marca-texto das anotações.

Análogas

Menta + turquesa + céu

Vizinhas a 30° da turquesa. Degradês, fundos de dados e ilustrações calmas.

Complementar dividida

Turquesa + laranja + framboesa

As duas vizinhas do oposto exato (356°), a 30° de cada lado. Campanhas e eventos que pedem mais energia.

Todas as cores de apoio foram calculadas na roda a partir da turquesa (176°). Nunca substituem as primárias.

02 Degradê

Degradê de marca: turquesa, céu e azul sinal, as análogas da roda de cores. Use só em fundos grandes e capas, nunca em texto ou no logo.

Degradê de foto: noturno de 0 a 100%, para dar leitura ao texto sobre imagem.

02 Exemplos de uso

Use a turquesa para o que precisa ser visto primeiro: números, destaques e chamadas. Noturno e azul sinal seguram o fundo.

Com cores saturadas, combine com noturno, branco ou papel para dar leitura. Evite usar turquesa e rosa grandes na mesma peça.