Converter HSL para RGBA
Converta matiz, saturação e luminosidade em um valor rgba() pronto para transparência no CSS.
Entrada hsl
Resultado · RGBA
rgba(255, 61, 119, 1)
HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Como usar: HSL para RGBA
- 1
Insira uma cor
Digite um código de cor ou escolha uma cor com o seletor: cada campo aceita o formato que exibe.
- 2
Veja a conversão
O resultado é atualizado instantaneamente enquanto você digita, junto com uma pré-visualização da cor em tempo real.
- 3
Copie o código
Copie o valor de que precisa com um clique e cole-o no seu design, no seu CSS ou nas configurações de impressão.
Sobre HSL e RGBA
HSL e RGBA vêm de duas formas diferentes de pensar a cor. O HSL define uma cor por matiz, saturação e luminosidade, o que facilita criar um conjunto de tons relacionados. O RGBA a define por valores de canal vermelho, verde e azul de 0 a 255 mais um canal alfa para a opacidade — o formato que muitas bibliotecas JavaScript, códigos de desenho em canvas, ferramentas de gráficos e bases de código CSS mais antigas esperam.
O conversor transforma seus valores HSL em rgba() com o alfa em 1, ou seja, totalmente opaco. Edite esse último número para obter transparência: 0.8 para um painel levemente translúcido, 0.3 para uma sobreposição em uma foto, 0 para invisível. Dica: no CSS moderno também é possível adicionar alfa diretamente ao HSL, como em hsl(160 60% 45% / 0.3), mas o rgba() é a escolha mais segura quando uma biblioteca ou um modelo de e-mail não suporta a sintaxe mais nova.
Tudo funciona localmente no seu navegador: suas imagens nunca são enviadas para um servidor.