Gere uma paleta de cores análogas a partir de uma cor hexadecimal

O gerador converte a cor base para HSL, distribui as cores uniformemente em uma faixa de sessenta graus centralizada no matiz original e converte cada resultado para hexadecimal normalizado. Uma solicitação de uma cor devolve o próprio matiz base; paletas maiores incluem os dois limites de trinta graus. O cálculo determinístico atende tokens de design, gráficos, ilustrações e pipelines repetíveis.

Escolha a cor base e o tamanho da paleta

Comece com uma cor hexadecimal CSS de três ou seis dígitos, com cerquilha inicial opcional. A forma curta é expandida antes da conversão; portanto, #36c e #3366cc indicam a mesma cor inicial e geram a mesma saída normalizada. Em seguida, escolha count, que define o número exato de amostras retornadas. Esse valor precisa ser um inteiro igual ou superior a um; zero e números negativos são recusados porque não descrevem uma paleta. Quando count é um, o gerador devolve o matiz base sem deslocamento. Quando é dois, devolve os limites de menos trinta e mais trinta graus. Com três cores, a base fica entre os limites. Quantidades maiores acrescentam intervalos iguais na mesma faixa, sem ampliar a harmonia. Saturação e luminosidade permanecem iguais às da base, isolando o matiz como única dimensão variável. A resposta informa a cor normalizada, a quantidade e cada amostra com índice, deslocamento sinalizado, ângulo circular e hexadecimal de seis dígitos em minúsculas.

Entenda o espaçamento uniforme no círculo cromático

Cores análogas ocupam posições vizinhas em um círculo de matizes. Esta capacidade usa uma faixa fixa entre trinta graus abaixo e trinta graus acima do matiz base, totalizando sessenta graus. Para count maior que um, o intervalo resulta da divisão dessa amplitude por count menos um. Cinco cores usam -30, -15, 0, 15 e 30 graus; quatro usam -30, -10, 10 e 30. Como o matiz é circular, um deslocamento que cruza zero continua próximo de trezentos e sessenta, em vez de virar um ângulo negativo inválido. O algoritmo interpreta os canais RGB, converte-os para HSL, aplica cada deslocamento e transforma o HSL novamente em RGB inteiro e hexadecimal. O arredondamento é determinístico, fazendo entradas idênticas produzirem o mesmo JSON. Tons neutros continuam válidos: o cinza tem saturação zero, então mudar seu matiz matemático não altera o RGB visível e pode gerar códigos hexadecimais repetidos.

Use a paleta em fluxos de produção

Use o array gerado quando uma família repetível de cores relacionadas for mais importante do que um contraste forte. Um sistema de design pode associar índices a propriedades como accent-1 até accent-5 e regenerá-las quando a cor principal da marca mudar. Um criador de gráficos pode solicitar a quantidade de séries do relatório e atribuir as amostras em ordem para preservar a coesão. Ferramentas de ilustração podem transformar uma semente escolhida artisticamente em cores controladas para preenchimentos e detalhes, embora ajustes de luminosidade devam ocorrer separadamente. O resultado também funciona bem em testes de snapshot porque não contém aleatoriedade, data, resposta de rede ou variação de modelo. Guarde a cor base e count como fonte oficial. Antes de aplicar qualquer amostra a textos, ícones ou controles, verifique o contraste com o fundo real: harmonia análoga não garante conformidade WCAG. Cada item bem-sucedido na API custa US$ 0,002; valide count na interface e mostre o erro quando ele for menor que um ou não for inteiro.