Como criar uma paleta de cores

Gere paletas a partir de regras de harmonia, ajuste cada cor, confira o contraste para acessibilidade, simule daltonismo, crie gradientes e escalas de tons, extraia cores de uma imagem e exporte em vários formatos. Tudo roda no seu navegador.

Harmonias de cores

As harmonias usam a posição das cores no círculo cromático. Análogas são vizinhas e criam um visual calmo. Complementares ficam em lados opostos e geram contraste forte. Triádicas e tetrádicas distribuem as cores em intervalos iguais e são mais vibrantes.

Uma regra prática para interfaces é usar uma cor principal, uma ou duas de apoio e tons neutros para fundos e textos.

Contraste e acessibilidade

As diretrizes WCAG pedem contraste mínimo de 4,5:1 entre texto e fundo para textos comuns e de 3:1 para textos grandes. A aba de acessibilidade mostra essas razões para cada combinação.

A simulação de daltonismo mostra como a paleta é vista por pessoas com diferentes tipos de deficiência na percepção de cores. Evite transmitir informação só pela diferença entre vermelho e verde.

Perguntas frequentes

Em quais formatos posso exportar?

HEX, CSS, SCSS, JSON, Tailwind, JavaScript, TypeScript, SVG, GPL (para GIMP e Inkscape) e ASE (para programas da Adobe).

Como compartilho uma paleta?

Copie o link de compartilhamento: as cores ficam no próprio endereço, e quem abrir verá a mesma paleta.

As cores extraídas de uma imagem são enviadas para algum lugar?

Não. A imagem é analisada no seu navegador e não sai do seu dispositivo.