01 / Exemplo
Exemplo
hsl(210, 70%, 50%)rgb(38, 128, 217)Texto e código / MULTIVERTO
Transforme matiz, saturação e luminosidade em canais RGB inteiros.
Aplique cada ferramenta de texto ao resultado anterior. Fluxos de trabalho com texto ↗
Somente o nome da sequência e a ordem das ferramentas são salvos neste navegador. Sua entrada e seus resultados nunca são salvos.
01 / Exemplo
hsl(210, 70%, 50%)rgb(38, 128, 217)02 / Guia
Converta matiz, saturação e luminosidade em canais RGB inteiros. Use essa direção quando um design de cor começa com um matiz e duas porcentagens, mas outra ferramenta requer canais RGB numéricos. Insira hsl(210, 70%, 50%) ou os mesmos valores separados por vírgulas. O matiz varia de zero a 360 graus; saturação e clareza variam de zero a cem por cento.
O matiz escolhe um setor de cor; croma e luminosidade determinam os três canais RGB, arredondados para inteiros. O algoritmo encontra uma croma a partir da saturação e da luminosidade, coloca-a no setor de matiz e, em seguida, adiciona um deslocamento comum para formar vermelho, verde e azul. Ele arredonda canais para inteiros de zero a 255. Uma tonalidade de 360 graus envolve a zero. Uma cor HSL com saturação zero fica cinza, independentemente de sua tonalidade.
Antes de usar o resultado em software que pede canais inteiros, verifique se as porcentagens de entrada significam saturação e claridade nessa ordem. O resultado não tem canal alfa; essa ferramenta usa RGB inteiro e HSL convencional, não perfis de gerenciamento de cores. Escolha o formulário esperado pelo local onde você vai colar o resultado. CSS aceita notações hexadecimais, rgb() e hsl(), mas um sistema de design ou programa de gráficos pode armazenar canais separadamente. Essa ferramenta usa a aritmética sRGB comum; ela não converte entre perfis de exibição nem prevê como cada monitor reproduzirá uma cor. Nem o HEX de três canais nem essas saídas RGB e HSL incluem transparência. Um código alfa de quatro ou oito dígitos precisa de uma operação separada. Os canais RGB inteiros e os decimais HSL exibidos também podem ser arredondados, portanto, uma viagem de ida e volta pode diferir em um valor de canal.
Na saturação zero, a alteração da tonalidade não pode alterar a saída de cinza; na luminosidade zero, toda tonalidade válida se torna preta. Na luminosidade total, toda tonalidade se torna branca. Essas verificações de ponto final são mais confiáveis do que julgar apenas uma visualização minúscula. Os canais calculados são arredondados para inteiros, portanto, uma passagem posterior de RGB para HSL pode não reproduzir cada decimal das porcentagens originais. Preserve a fonte HSL se você planeja continuar editando a tonalidade ou a saturação em um sistema de design.
Para uma verificação concreta, a entrada de exemplo hsl(210, 70%, 50%) produz rgb(38, 128, 217). Mantenha o original ao lado do resultado ao compará-lo com outro aplicativo. Para uma segunda verificação, insira o resultado exibido na ferramenta de cor reversa e compare-o com a entrada original. HEX e inteiro RGB podem circular exatamente; porcentagens HSL podem arredondar um canal RGB por um. Mantenha o token de origem se essa distinção for importante.
Explorar guias