Cor Conversor
Conversor de formato de cores de três vias – digite qualquer campo e HEX, RGB e HSL serão atualizados instantaneamente. A amostra de visualização ao vivo mostra a cor conforme você digita. Clique em Copiar ao lado de qualquer campo para obter o valor de CSS ou ferramentas de design.
Como converter formatos de cores
Insira qualquer valor de cor para começar
Digite ou cole um valor de cor em qualquer um dos três campos – HEX, RGB ou HSL. Os outros dois são atualizados conforme você digita, sem pressionar Enter ou clicar em um botão. A amostra de visualização à esquerda mostra o resultado ao vivo. Clique em Copiar ao lado de qualquer campo para copiar o valor formatado diretamente para a área de transferência, pronto para colar em CSS ou em uma ferramenta de design.
Códigos HEX – o padrão CSS
As cores HEX usam seis dígitos hexadecimais prefixados com #, por exemplo #FF5733. Cada par de dígitos representa um canal vermelho, verde ou azul em uma escala de 00 (nenhum) para FF (intensidade total). Abreviação de três dígitos como #FFF ou #ABC também é aceito e expandido automaticamente. HEX é o formato mais comum em CSS, atributos HTML e ferramentas de design como Figma, Sketch e Adobe XD.
RGB — valores de canal vermelho, verde e azul
RGB especifica a intensidade da luz vermelha, verde e azul usando números inteiros de 0 a 255. O formato CSS é rgb(R, G, B), por exemplo rgb(255, 87, 51). Esse formato mapeia diretamente como o hardware de exibição renderiza as cores e é conveniente ao passar valores de cores para JavaScript, APIs de desenho 2D do Canvas ou código de processamento de imagem que espera componentes de canal separados.
HSL – matiz, saturação, luminosidade
HSL representa uma cor como matiz (0–360°, a posição angular na roda de cores), saturação (0–100%, a vivacidade da cor) e luminosidade (0–100%, do preto puro, passando pela cor, até o branco puro). O formato CSS é hsl(H, S%, L%), por exemplo hsl(11, 100%, 60%). HSL é preferido ao gerar paletas de cores porque o ajuste do matiz altera a família de cores enquanto o brilho e a saturação gerais permanecem constantes.
Perguntas frequentes
Quais formatos de cores este conversor suporta?
A ferramenta converte entre HEX (hexadecimal como #FF5733), RGB (rgb(255, 87, 51)) e HSL (hsl(11, 100%, 60%)). Todos os três campos são atualizados simultaneamente sempre que qualquer um deles é alterado.
Como faço para converter um código HEX em RGB?
Cole seu código HEX - com ou sem o # prefixo - no campo HEX. Os campos RGB e HSL são atualizados imediatamente. Clique em Copiar próximo ao campo RGB para obter o valor formatado para uso em CSS ou JavaScript.
Qual é a diferença entre RGB e HSL?
RGB mistura luz vermelha, verde e azul (0–255 cada), mapeando diretamente a forma como as telas renderizam as cores. HSL descreve a mesma cor que matiz (posição da roda de cores, 0–360°), saturação (vivacidade, 0–100%) e luminosidade (brilho, 0–100%). HSL é mais intuitivo para criar paletas porque girar o matiz muda a cor enquanto mantém constante o brilho e a riqueza geral.
Posso inserir um código HEX curto de três dígitos?
Sim. A abreviação de três dígitos é expandida automaticamente: #FFF torna-se #FFFFFF, #ABC torna-se #AABBCC, e #000 torna-se #000000. Formulários de 3 e 6 dígitos são aceitos com ou sem o início #.
Minhas cores são carregadas em um servidor?
Não. Todas as conversões são executadas inteiramente no seu navegador usando JavaScript. Nenhum valor de cor, dados de entrada ou informações de uso são enviados para qualquer servidor. A ferramenta funciona offline assim que a página é carregada.