ForHosting KIT · Imagens

Conversor RGB para HSL

Veja qualquer cor RGB como matiz, saturação e luminosidade: 255, 128, 64 vira 20.1°, 100 % e 62.55 %. Assim você ajusta o tom ou monta temas claros e escuros sem chutar valores. Grátis no seu navegador.

  • Grátis
  • Funciona no seu navegador
  • Sem cadastro
  • Seus dados não saem do seu aparelho
Use pelo WebAPIE-mailTelegramApp em breve
Se você digitar
Resistência (Ω)
255
G
128
B
64
Você obtém
H
20,1047
S
100
L
62,549
Matiz
20,1047

Designers, desenvolvedores front-end e autores de pipelines costumam guardar cores como inteiros de vermelho, verde e azul de zero a duzentos e cinquenta e cinco, mas precisam de matiz, saturação e luminosidade para ajustar o tom sem deslocar o brilho, montar variáveis CSS ou alimentar ferramentas sensíveis à cor. Este conversor RGB para HSL aceita três canais nesse intervalo de byte padrão, executa uma conversão determinística no estilo sRGB e devolve matiz em graus mais saturação e luminosidade em porcentagens, junto com strings hsl CSS modernas e clássicas que você pode colar em folhas de estilo. Canais fora de zero a duzentos e cinquenta e cinco falham com um erro claro de entrada inválida, de modo que dados ruins nunca sofrem clamp silencioso.

Informar canais RGB e o que a conversão calcula

Informe três números chamados r, g e b para vermelho, verde e azul. O motor primeiro normaliza cada canal dividindo por duzentos e cinquenta e cinco para que os valores fiquem no intervalo unitário. Em seguida encontra o máximo e o mínimo desses três componentes normalizados e a croma como a diferença entre eles.

A luminosidade é a metade da soma do máximo e do mínimo. Quando a croma é zero a cor é acromática: o matiz é zero e a saturação é zero, restando só a luminosidade para descrever cinzas do preto ao branco passando pelo cinza médio. Quando a croma é positiva, a saturação é a croma dividida por um menos o valor absoluto de duas vezes a luminosidade menos um, que é a fórmula padrão de saturação HSL usada em CSS e em pilhas gráficas.

O matiz se constrói a partir do setor da roda de cores onde o canal máximo se situa: dominante em vermelho, verde ou azul, escalado a graus no intervalo semiaberto de zero até trezentos e sessenta.

CSS e tokens de design

Converta amostras RGB de ferramentas de design em HSL para que temas ajustem matiz ou luminosidade mantendo políticas de saturação coerentes em modos claro e escuro.

Pipelines de paleta e marca

Automação que parte de cores de marca RGB deriva componentes HSL para gerar tintas, sombras e variantes de destaque sem clampar em silêncio canais fora de faixa.

Como converto RGB para HSL com esta ferramenta?

A resposta inclui h, s, l, strings CSS e um objeto hsl aninhado.

O que acontece se um canal estiver fora de 0–255?

Cada um de r, g e b deve estar entre 0 e 255 inclusive; valores fora de faixa são rejeitados e não cobrados.

Matiz, saturação e luminosidade são porcentagens ou frações 0–1?

O matiz está em graus de 0 até 360. Saturação e luminosidade são porcentagens de 0 a 100, alinhadas ao uso comum de hsl() em CSS.

O conversor RGB para HSL é gratuito?

A ferramenta do navegador roda grátis no seu dispositivo.

Como é calculada a luminosidade HSL?

Cada canal é dividido por 255, e a luminosidade é a metade da soma do maior e do menor valor. Para 255, 128, 64 o resultado é 62.55 %.

Tudo nesta página está disponível via API. Esta seção é para equipes que querem integrar a ferramenta aos próprios sistemas; quem não precisa disso pode simplesmente usar a ferramenta acima.

POSThttps://api.kit.forhosting.com/color/rgb-hsl

Autenticação por token Bearer. Um único POST coloca a tarefa na fila; o resultado chega por webhook ou link assinado.

curl -X POST https://api.kit.forhosting.com/color/rgb-hsl \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d '{"r":255,"g":128,"b":64}'
{
  "r": 255,
  "g": 128,
  "b": 64
}
{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "color.rgb_hsl",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

A API é assíncrona: cada chamada devolve um task_id na hora. Se preferir polling, consulte o status a até 1 requisição por segundo.

por chamadaUS$ 0,002

Preço publicado, sem tokens nem créditos escondidos. Tarefa que falha não é cobrada.

HTTPCódigoO que significa
401unauthorizedToken ausente ou inválido. Confira o header Authorization.
402insufficient_balanceSaldo insuficiente para esta tarefa. Faça uma recarga e tente de novo.
404unknown_typeEsse tipo de tarefa não existe. Confira o campo type no catálogo.
429rate_limitedMuitas requisições em pouco tempo. Espere um instante e tente de novo.

Informar canais RGB e o que a conversão calcula

Cada canal deve ser um número finito entre zero e duzentos e cinquenta e cinco inclusive; strings inteiras como "128" são aceitas, e os aliases red, green e blue mapeiam para os mesmos campos se preferir nomes longos. Entradas idênticas sempre produzem JSON idêntico porque o caminho é aritmética pura, sem rede, sem semente aleatória e sem relógio de parede.

Ler matiz, saturação, luminosidade e strings CSS

Em caso de sucesso a resposta ecoa os canais de entrada r, g e b e, em seguida, expõe h, s e l para matiz em graus, saturação em porcentagem e luminosidade em porcentagem. O vermelho puro duzentos e cinquenta e cinco zero zero produz matiz zero com saturação plena e luminosidade média; o verde puro e o azul puro caem perto de cento e vinte e duzentos e quarenta graus respectivamente; canais iguais produzem cinzas com saturação zero. Os mesmos três números reaparecem sob os nomes longos hue, saturation e lightness, e aninhados dentro de um objeto hsl, de modo que código de IU, demos de SDK e avaliadores podem escolher a forma que couber sem mapeamento extra. Duas strings prontas para colar estão incluídas: hsl_css usa a forma moderna do CSS Color Module separada por espaços, como hsl(30 100% 50%), e hsl_legacy usa a forma clássica com vírgulas e parênteses que analisadores antigos ainda esperam. O campo method é sempre rgb_to_hsl para que roteadores posteriores possam ramificar sem cheirar formas. Falta de qualquer canal obrigatório, valores não numéricos e qualquer canal fora de zero a duzentos e cinquenta e cinco falham com invalid_input e não são cobrados após a rejeição do motor.

Uso da API, preços, fluxos de design e limites práticos

Chame o conversor RGB para HSL gratuito no navegador para ajustes de paleta, demos de aula e verificações rápidas sem instalar uma biblioteca de cor. Combine saídas HSL com verificadores de contraste ao construir temas acessíveis, ou alimente deslocamentos de matiz em pipelines de tokens de marca que mantêm a luminosidade fixa ao rotacionar acentos. Autores que publicam SDKs podem mapear h, s e l diretamente em controles de formulário ou propriedades personalizadas CSS sem reimplementar a conversão em cada linguagem. Envie um corpo JSON com os números obrigatórios r, g e b no intervalo publicado. Use a API pré-paga quando um sistema de design, gerador de temas, pipeline de acessibilidade ou ferramenta de cor de e-commerce precisar de um contrato estável sob saldo KIT a US$ 0,002 por item bem-sucedido; falhas de validação nunca consomem saldo após a rejeição do motor. Prefira este endpoint quando a intenção de busca e o enquadramento do produto forem especificamente RGB para HSL com limites rígidos de canal; para conversão multiformato entre HEX, RGB, HSL, LAB e CMYK em uma só chamada, use o conversor de cor mais amplo do catálogo.

Ensino e avaliação da matemática da cor

Cursos e avaliações de programação conferem respostas RGB→HSL dos alunos com JSON determinístico, com invalid_input claro quando algum canal cai fora de 0–255.

Posso usar os aliases red, green e blue?

Sim. Os campos red, green e blue são aceitos como aliases de r, g e b para que clientes usem nomes de canal curtos ou longos.

Ver a documentação completa do KIT →