🎨 Conversor de cores — HEX, RGB e HSL

🎯 Paletas de cores

🕐 Cores recentes

Conversão instantânea

Converta entre os formatos HEX, RGB e HSL em tempo real. Insira qualquer formato e obtenha os outros dois instantaneamente.

Seletor visual

Seletor de cores integrado para seleção intuitiva de cores com uma grande amostra de visualização ao vivo.

Paletas de cores

Gere automaticamente esquemas de cores complementares, análogos, triádicos e complementares divididos.

Cópia com um clique

Copie qualquer formato de cor para sua área de transferência com um único clique. Rápido e fácil de usar.

Histórico de cores

Salva automaticamente as cores usadas recentemente para acesso e reutilização rápidos.

Totalmente off-line

Todo o processamento acontece no seu navegador. Não é necessária internet, nenhum dado é carregado.

Artigos relacionados

Modelos de cores explicados: RGB, HSL, HEX

Um mergulho profundo nos princípios e diferenças de RGB, HSL, HEX e outros modelos de cores. Entenda como diferentes espaços de cores funcionam para controlar com precisão as cores em seus designs.

Guia para iniciantes (em inglês)

Princípios básicos da teoria das cores para designers

A teoria das cores é a base do design. Da roda de cores Itten aos sistemas de cores modernos, domine o conhecimento essencial de cores e as técnicas práticas de paleta que todo designer precisa.

Teoria do Projeto (em inglês)

Guia de contraste de cores acessível: atendendo aos padrões WCAG

Aprenda sobre os padrões de contraste de cores WCAG e como escolher paletas de cores acessíveis que tornem seu site amigável para todos os usuários, incluindo aqueles com deficiência visual.

Acessibilidade (em inglês)

Psicologia das cores em branding: contando histórias com cores

Cores diferentes evocam respostas emocionais diferentes. Explore como a psicologia das cores se aplica ao design da marca e aprenda a escolher as cores que melhor comunicam a identidade da sua marca.

Marca (em inglês)

Perguntas frequentes

Qual é a diferença entre HEX, RGB e HSL?
HEX é um código de cores hexadecimal (por exemplo, #FF5733) comumente usado em CSS da web. RGB representa cores usando valores de vermelho, verde e azul (0-255). HSL usa Matiz, Saturação e Luminosidade, tornando o ajuste de cores mais intuitivo.
O que são cores complementares?
Cores complementares são duas cores posicionadas com 180° de distância na roda de cores. Eles criam um forte contraste visual e são frequentemente usados ​​para elementos que precisam se destacar nos designs.
Como escolho um bom esquema de cores?
Use nosso gerador de paleta. Os esquemas análogos são harmoniosos e sutis, os esquemas complementares proporcionam forte contraste e os esquemas triádicos oferecem uma variedade de cores rica, porém equilibrada. Escolha com base em seus objetivos de design.
Por quanto tempo o histórico de cores é salvo?
O histórico de cores é armazenado no localStorage do seu navegador. Ele persiste até que você o limpe manualmente ou limpe os dados do navegador.
Suporta transparência (alfa)?
Atualmente suporta os formatos padrão HEX (6 dígitos), RGB e HSL. Para transparência alfa, você pode adicionar manualmente dois dígitos ao HEX (por exemplo, #FF573380) ou usar o formato rgba().
Como faço para converter HEX em RGB e HSL?

Insira um valor de cor válido na entrada HEX. A ferramenta exibe os valores RGB e HSL correspondentes, que você pode copiar para sua folha de estilo.

Posso visualizar uma cor enquanto converto seu código?

Sim. A visualização de cores é atualizada com o valor inserido. Ajuda a comparar a cor durante a leitura ou cópia de outros formatos suportados.