Gerador de Paleta de Cores

Escolha uma cor base e gere paletas harmoniosas — complementar, triádica, análoga, complementar dividida e monocromática.

Como usar

  1. Escolha uma cor base com o seletor de cores ou digite um código hexadecimal.
  2. Escolha o tipo de harmonia — complementar, triádica, análoga, complementar dividida ou monocromática.
  3. Clique em "Gerar paleta" — as cores aparecem como amostras com códigos hex. Clique em qualquer amostra para copiar o código.

Sobre esta ferramenta

Harmonia de cores é o princípio de que certas combinações de matizes parecem equilibradas juntas. A teoria vem do círculo cromático: cores complementares ficam opostas (máximo contraste), cores análogas ficam lado a lado (mínimo contraste) e cores triádicas formam um triângulo equilátero (contraste equilibrado). Complementar dividida pega os dois vizinhos da complementar, e monocromática varia a luminosidade e saturação de um único matiz.

Este gerador trabalha no espaço de cores HSL, onde H é o ângulo do matiz no círculo, S é saturação e L é luminosidade. As harmonias são geométricas: complementar adiciona 180° ao matiz, triádica adiciona 120° e 240°, análoga adiciona e subtrai 30°. Os resultados são pontos de partida para um design — o trabalho real de paleta ajusta saturação e luminosidade para equilibrar o peso visual e testa a paleta no conteúdo real em que será usada.

Clique em qualquer amostra para copiar o código hex para a área de transferência. Tudo roda no navegador e nada é armazenado.

A fórmula

Complementar: H+180°. Triádica: H+120°, H+240°. Análoga: H−30°, H, H+30°. Complementar dividida: H+150°, H+210°. Monocromática: mesmo H, S e L variados.

Perguntas frequentes

Qual harmonia devo usar?

Complementar para máximo contraste (botões de ação, estados de alerta). Análoga para um visual calmo e coeso. Triádica para uma paleta equilibrada com variedade. Monocromática para um design de cor única de marca.

Posso usar essas cores comercialmente?

Cores não são protegidas por direitos autorais. A paleta que você gera é sua para usar.

Por que as cores parecem diferentes no celular?

Porque as telas têm gamuts de cores e calibrações diferentes. O código hex é o mesmo; a aparência depende do display.

Verifica o contraste para acessibilidade?

Não diretamente — use a ferramenta Verificador de Contraste WCAG para isso. Esta ferramenta gera paletas harmônicas; o verificador de contraste diz se o primeiro plano e o fundo atendem aos padrões de acessibilidade.

Ferramentas relacionadas

Links longos? Encurte de graça

O Vai.la transforma qualquer URL em um link curto com estatísticas de cliques, QR Code e seu próprio biolink.

O Vai.la não se responsabiliza pelo uso das ferramentas nem por decisões tomadas com base nos seus resultados.