Gerador de variantes quentes e frias de uma cor

Informe uma cor hexadecimal cromática e receba cinco valores coordenados: duas opções mais quentes, a base normalizada e duas opções mais frias. Cada variante preserva a saturação e a luminosidade de origem enquanto o matiz se aproxima de um alvo laranja ou azul definido. Assim, entradas iguais sempre geram a mesma paleta compacta e fácil de explicar.

Como as variantes quentes e frias são criadas

O gerador primeiro converte a cor hexadecimal de RGB para HSL, espaço no qual o matiz pode ser ajustado independentemente da saturação e da luminosidade. Ele adota 30 graus como alvo quente, na região do laranja, e 220 graus como alvo frio, na região do azul. Em cada direção, uma variante suave percorre 35 por cento da menor distância circular até o alvo, enquanto uma variante forte percorre 70 por cento. Usar o caminho mais curto é importante perto do limite de zero grau, pois o matiz forma um círculo, não uma linha numérica. A saturação e a luminosidade originais permanecem iguais, o que mantém os cinco resultados relacionados em vez de formar uma coleção arbitrária de cores mais claras, escuras, vivas ou opacas. A resposta vem na ordem quente forte, quente suave, base, fria suave e fria forte. Cada registro informa temperatura e intensidade, além do valor hexadecimal e do matiz calculado em graus. Como alvos, proporções, arredondamento e ordem são fixos, a mesma entrada válida sempre produz exatamente a mesma paleta em qualquer ambiente compatível.

Como escolher e interpretar a cor base

Informe uma cor CSS hexadecimal de três ou seis dígitos, com ou sem o sinal de cerquilha inicial. A notação de três dígitos é expandida antes do cálculo, e a resposta inclui o valor normalizado de seis dígitos. Uma base cromática funciona melhor porque a variação de temperatura depende de um matiz significativo. Cinza neutro, preto puro e branco puro têm saturação HSL igual a zero, portanto não possuem um matiz que possa ser direcionado honestamente ao laranja ou ao azul. O gerador rejeita essas entradas em vez de inventar saturação e devolver cores que deixariam de seguir uma transformação apenas de matiz. Considere as variantes suaves como alternativas discretas para estados próximos de uma interface, elementos gráficos de apoio ou detalhes secundários. As variantes fortes mostram mudanças de temperatura mais evidentes sem abandonar a saturação e a luminosidade da fonte. A paleta auxilia a coordenação criativa, mas não verifica contraste. Antes de aplicar um resultado a textos, controles, indicadores de estado ou outros elementos importantes para acessibilidade, avalie a combinação específica de primeiro plano e fundo com uma ferramenta dedicada. Também examine as cores no contexto final, pois tons vizinhos alteram sua percepção.

Como usar paletas determinísticas no fluxo de trabalho

Uma transformação fixa é especialmente útil quando as cores precisam ser regeneradas por código, documentadas em um sistema de design ou revisadas por várias equipes. Você pode armazenar uma única cor base aprovada e obter as mesmas alternativas quentes e frias sempre que criar um tema, gráfico, ilustração ou material de campanha. Isso reduz a variação causada por escolhas manuais e deixa a origem de cada amostra fácil de justificar: as variantes diferem por um deslocamento mensurável de matiz, não por uma decisão visual sem registro. O conjunto com cinco cores é propositalmente compacto para facilitar a comparação imediata. Uma equipe de produto pode reservar as opções suaves para estados de interação e fundos, usando as fortes para destaque; uma equipe de dados pode separar cenários quentes e frios mantendo a mesma intensidade visual; profissionais de ilustração podem adotar o conjunto como ponto de partida controlado antes dos ajustes de contexto. A API custa US$ 0,002 por solicitação, enquanto o navegador executa localmente a mesma lógica determinística. Nenhum dos caminhos usa consulta externa, aleatoriedade, horário, histórico do usuário ou perfil de cor dependente do ambiente.