Conversor de HSL para HEX
Converta HSL para HEX em tempo real enquanto digita — grátis, instantâneo, com exemplo prático e tabela de cores comuns.
Digite um valor HSL para ver o valor HEX correspondente logo abaixo, ou escolha uma cor no seletor.
Exemplo prático
HSL 11, 100%, 60% = HEX #ff5733
Como funciona a conversão
- Um código HEX representa os mesmos três canais RGB escritos em base 16: dois dígitos por canal, variando de 00 (0) a ff (255).
- O HSL descreve a mesma cor por meio de matiz (hue, de 0 a 360° no círculo cromático), saturação e luminosidade — ideal para escurecer ou dessaturar uma cor alterando apenas um componente.
Cores comuns em HSL e HEX
| Cor | HSL | HEX |
|---|---|---|
| Vermelho | 0, 100%, 50% | #ff0000 |
| Laranja | 39, 100%, 50% | #ffa500 |
| Amarelo | 60, 100%, 50% | #ffff00 |
| Verde | 120, 100%, 25% | #008000 |
| Ciano | 180, 100%, 50% | #00ffff |
| Azul | 240, 100%, 50% | #0000ff |
| Roxo | 300, 100%, 25% | #800080 |
| Rosa | 350, 100%, 88% | #ffc0cb |
| Marrom | 0, 59%, 41% | #a52a2a |
| Branco | 0, 0%, 100% | #ffffff |
| Cinza | 0, 0%, 50% | #808080 |
| Preto | 0, 0%, 0% | #000000 |
Cada conversão roda no seu navegador. Nada do que você digita é enviado para o BroBroGo.
Perguntas frequentes
Como converter HSL para HEX?
Digite ou cole seu valor HSL acima — o valor HEX é atualizado instantaneamente enquanto você digita. Você também pode escolher a cor visualmente usando o seletor de cores.
A conversão é exata?
Os valores são arredondados para números inteiros, que é o formato esperado pelo CSS e por ferramentas de design. A diferença fica muito abaixo do que o olho humano consegue perceber.