Seletor de Cores
Ferramenta de seleção de cores online, conversão de formato HEX, RGB, HSL, gerar esquemas de cores
O que é um Seletor de Cores?
Um seletor de cores é uma ferramenta comumente usada em desenvolvimento frontend e design UI que ajuda você a selecionar cores precisamente e converter entre diferentes formatos. HEX usa notação hexadecimal, RGB é baseado em primárias vermelho, verde e azul, e HSL é baseado em tonalidade, saturação e luminosidade — cada um com seus casos de uso.
Como Usar
- Clique no seletor de cores para selecionar uma cor, ou digite um valor de cor no campo de entrada
- Veja resultados de conversão em formatos HEX, RGB e HSL
- Clique o botão copiar próximo a um formato para copiar o valor da cor
- Consulte esquemas de cores para sugestões de combinação complementar, análoga e outras
- Verifique tons e tintas para variantes mais claras e mais escuras da mesma cor
Usos Comuns
- Desenvolvimento CSS: Rapidamente obtenha valores de cor HEX/RGB/HSL para código de estilo
- Design UI: Selecione cor primária da marca e gere esquemas de cores completos
- Teste de Acessibilidade: Garanta contraste suficiente entre texto e cores de fundo
- Conversão de Cor: Rapidamente converta entre diferentes formatos de cor
FAQ
Q: Qual a diferença entre HEX, RGB e HSL?
A: HEX usa hexadecimal (ex: #2563eb), comum em CSS; RGB usa componentes vermelho, verde, azul (ex: rgb(37,99,235)), bom para programação; HSL usa tonalidade/saturação/luminosidade (ex: hsl(217,91%,53%)), mais intuitivo.
Q: O que são cores complementares?
A: Cores complementares são opostas no círculo de cores, como vermelho e verde, ou azul e laranja. Esquemas de cores complementares criam contraste forte e são frequentemente usados para destacar elementos.
Q: Como escolher um bom esquema de cores?
A: Esquemas análogos são harmoniosos e naturais, adequados para maioria dos casos; esquemas complementares têm contraste forte, bom para ênfase; esquemas triádicos são vibrantes, bom para estilos animados. Uma boa proporção é 60% primária, 30% secundária, 10% destaque.
Q: Dados de cores serão enviados para servidores?
A: Não. Todos os cálculos de cor acontecem localmente no seu navegador. Nenhum dado é enviado.