Esquema de Cores Análogas

Um esquema de cores análogo usa cores que ficam próximas umas das outras na roda de cores, geralmente dentro de 30 a 60 graus de um matiz base. Como os matizes estão próximos, essas paletas parecem harmoniosas e coesas em vez de alto contraste.

Sua cor base é convertida para HSL, depois novas cores são geradas deslocando o matiz para cima e para baixo pelo passo de ângulo que você escolhe, mantendo a mesma saturação e luminosidade da cor base, então cada cor na paleta parece parte da mesma família.

30 graus é a escolha tradicional para esquemas análogos e funciona bem para a maioria dos designs. Use 15 graus para uma paleta mais sutil e agrupada, ou 45 graus para uma dispersão mais ampla que começa a introduzir mais contraste.

Sim, use "Copiar como variáveis CSS" para copiar um bloco :root pronto para colar com cada cor como propriedade personalizada, ou "Copiar como lista HEX" para copiar apenas os códigos hex, um por linha.

Esquemas complementares emparelham uma cor com sua oposta na roda (180 graus de distância) para alto contraste, e esquemas de tríade usam três cores igualmente espaçadas 120 graus. Esquemas análogos em vez disso mantêm todas as cores próximas, favorecendo harmonia sobre contraste.