Conversor de cores CSS
Converte HEX em RGB, HSL e valores arbitrários Tailwind.
Sobre esta ferramenta
O conversor transforma uma cor HEX nos equivalentes RGB e HSL e gera uma classe de fundo arbitrária do Tailwind pronta a colar no marcador. Serve bem para cores de marca ausentes da paleta predefinida.
Como usar
Altere o campo HEX e o resultado atualiza os canais e a forma bg-[#…]. Depois copie a notação de que o seu componente precisa.
Exemplo
A cor azul-céu predefinida mostra HEX, RGB, HSL e a classe arbitrária.
Entrada
#38bdf8
Saída
HEX: #38BDF8
RGB: rgb(56, 189, 248)
HSL: hsl(199, 93%, 60%)
Tailwind arbitrary: bg-[#38bdf8]
Dica
Valores arbitrários são Tailwind válido; aproximar a cor ao tom mais próximo da paleta costuma estragar a identidade.
Bom saber
Que formatos de cor converte?
Escreva um valor HEX de 3 ou 6 dígitos (ou use o seletor) e obtém RGB, HSL e uma classe arbitrária Tailwind como bg-[#38bdf8].
Porquê uma classe arbitrária e não a cor Tailwind mais próxima?
As cores de marca raramente coincidem com a paleta padrão. Aproximar altera o seu design sem aviso, enquanto bg-[#hex] mantém a cor exata.