Localizador de cores complementares
Informe qualquer cor nos formatos HEX, RGB ou HSL e veja na hora as seis harmonias cromáticas: complementar, complementar dividida, análoga, triádica, tetrádica e monocromática. Clique em qualquer amostra para copiar seu valor HEX ou exporte propriedades personalizadas CSS. Roda inteiramente no seu navegador, sem cadastro.
Enter any color in HEX, RGB, or HSL format to instantly see its complementary, split-complementary, analogous, triadic, tetradic, and monochromatic color harmonies. Click any swatch to copy its HEX value. All processing runs locally in your browser.
Accepts: #RGB, #RRGGBB, rgb(r,g,b), hsl(h,s%,l%)
Quick samples:
The color directly opposite on the color wheel (180°). Creates maximum contrast and visual tension.
The two colors adjacent to the complement (150° and 210°). High contrast with more variety than complementary.
Colors adjacent on the color wheel (±30° and ±60°). Creates harmonious, natural-looking palettes.
Three colors evenly spaced around the wheel (120° apart). Vibrant and balanced.
Four colors evenly spaced (90° apart). Rich and complex - works best when one color dominates.
Variations of the same hue with different lightness and saturation. Elegant and cohesive.
Por que usar nosso localizador de cores complementares?
- Geração instantânea de harmonias: o localizador gera as seis harmonias cromáticas em tempo real enquanto você digita. Informe qualquer cor e veja imediatamente os resultados complementar, complementar dividida, análoga, triádica, tetrádica e monocromática.
- Processamento seguro e privado: seus valores de cor nunca saem do seu dispositivo. O localizador roda inteiramente no seu navegador com matemática de cor local, sem enviar dados a lugar nenhum.
- Seis regras de harmonia cromática: obtenha as harmonias complementar, complementar dividida, análoga (±30°/±60°), triádica (120°), tetrádica/quadrada (90°) e monocromática - cada uma com valores HEX, RGB e HSL e exportação de variáveis CSS em um clique.
- 100% grátis para sempre: use este localizador sem cadastro, assinaturas, limites de taxa ou paywalls escondidos. Encontre harmonias para quantas cores quiser, totalmente de graça.
O que é um localizador de cores complementares?
Um localizador de cores complementares é uma ferramenta que calcula relações cromáticas segundo a posição das cores no círculo cromático HSL. Toda cor tem um conjunto de parceiras harmônicas - cores que funcionam bem juntas pela relação angular no círculo. A mais conhecida é a cor complementar, que fica exatamente a 180° no círculo e cria contraste máximo. Este localizador calcula seis tipos de harmonia a partir de qualquer cor de entrada e exibe cada amostra com seus valores HEX, RGB e HSL - tudo rodando localmente no navegador, sem chamadas ao servidor.
Como funciona nosso localizador de cores complementares
- Informe sua cor base: digite qualquer cor no formato HEX (#RRGGBB), RGB (rgb(r,g,b)) ou HSL (hsl(h,s%,l%)), ou use o seletor de cor para escolhê-la visualmente.
- Veja as seis harmonias na hora: o localizador converte sua entrada para HSL, gira o matiz segundo os ângulos de cada tipo de harmonia e exibe todas as amostras imediatamente - sem clicar em nenhum botão.
- Copie cores e variáveis CSS: clique em qualquer amostra para copiar seu valor HEX, ou use o botão CSS de cada harmonia para copiar um bloco de propriedades personalizadas CSS pronto para uso.
Os seis tipos de harmonia cromática
- Complementar: a cor diretamente oposta no círculo (180°). Cria contraste máximo - ideal para botões de chamada para ação e elementos de destaque.
- Complementar dividida: as duas cores adjacentes ao complementar (150° e 210°). Alto contraste com mais variedade e menos tensão que a complementar pura.
- Análoga: cores adjacentes no círculo (±30° e ±60°). Cria paletas harmoniosas e naturais - comuns na natureza e na fotografia.
- Triádica: três cores igualmente espaçadas a 120°. Vibrante e equilibrada - funciona bem em designs lúdicos e energéticos.
Limitações importantes
Os cálculos de harmonia cromática se baseiam no modelo de cor HSL, que gira o matiz preservando saturação e luminosidade. A harmonia monocromática ajusta luminosidade e saturação para criar variações tonais. Todos os cálculos são aproximações matemáticas: a harmonia percebida também depende do contexto, das cores ao redor e do caso de uso específico. Teste sempre sua paleta no ambiente de design real antes de finalizá-la.
Perguntas frequentes
Um localizador de cores complementares calcula relações cromáticas com base no círculo cromático HSL. Ele encontra as variações complementar (180°), complementar dividida (150°/210°), análoga (±30°/±60°), triádica (120°), tetrádica (90°) e monocromática de qualquer cor de entrada.
A cor complementar fica diretamente oposta no círculo cromático - a 180° em matiz. Pares complementares criam o contraste máximo. Por exemplo, o complementar do azul é o laranja.
A complementar usa a única cor diretamente oposta (180°). A complementar dividida usa as duas cores adjacentes ao complementar (150° e 210°), oferecendo contraste semelhante com mais variedade.
Sim. Todo o processamento acontece inteiramente no seu navegador. Seus valores de cor nunca saem do seu dispositivo.
Sim. A ferramenta é 100% grátis, sem cadastro, sem assinatura e sem limites de uso.
HEX (#RGB ou #RRGGBB), RGB (rgb(r,g,b)) e HSL (hsl(h,s%,l%)). Você também pode usar o seletor de cor integrado.
Clique em qualquer amostra para copiar seu valor HEX. Use o botão CSS de cada harmonia para copiar um bloco de propriedades personalizadas CSS. Use Copiar todos os valores HEX para copiar tudo de uma vez.
A harmonia monocromática usa o mesmo matiz, mas varia a luminosidade e a saturação para criar uma gama de tons do claro ao escuro - elegante e coesa para design de interface.
Os cálculos de harmonia se baseiam no modelo HSL. A harmonia percebida também depende do contexto e da calibração da tela. Teste sempre sua paleta no ambiente de design real.