Conversor de Cores HEX ↔ RGB ↔ HSL
Digite ou cole uma cor em qualquer formato — #ff6600, rgb(255, 102, 0) ou hsl(24, 100%, 50%) — e obtenha os três formatos instantaneamente, prontos para copiar. Um seletor de cores, tons e sombras estão incluídos.
🔒 100% privado — seus arquivos nunca saem do seu navegador
Tons (mais claros)
Sombras (mais escuras)
Clique em qualquer bloco para carregá-lo de volta no conversor.
Como usar Conversor de cores
- 1 Escolha uma cor, ou cole qualquer valor HEX / RGB / HSL na caixa de texto.
- 2 Copie o formato de que precisa — HEX, RGB e HSL estão sempre sincronizados.
- 3 Use as linhas de tons e sombras para variações mais claras ou escuras na hora.
Perguntas frequentes
Qual é a diferença entre HEX, RGB e HSL?
HEX (#ff6600) e RGB (rgb(255, 102, 0)) descrevem a mesma mistura vermelho-verde-azul; HEX é apenas uma notação compacta. HSL (hsl(24, 100%, 50%)) descreve matiz, saturação e luminosidade — muito mais fácil para humanos ajustarem.
Aceita formatos abreviados e mistos?
Sim — a abreviação #f60, HEX de 6 dígitos, rgb()/rgba() com vírgulas ou espaços e hsl()/hsla() são todos interpretados. A cor interpretada é pré-visualizada ao vivo para você ver exatamente o que obteve.
Os valores são limitados aos intervalos válidos?
Sim. Os canais RGB são limitados a 0–255 e o HSL a 0–360 / 0–100% / 0–100%, então um valor solto nunca quebra seu CSS em silêncio.