Gerador de cores aleatórias

Como usar o gerador de cores aleatórias

1. Define o Número de cores (de 1 a 20).
2. Escolhe um Modo: - Aleatório num intervalo sorteia cada cor de forma independente. Restringe os intervalos de Matiz (°), Saturação (%) e Luminosidade (%) com os campos «de» e «a» para ficares dentro de uma família de cores, por exemplo só tons pastel ou só azuis. - Paleta harmoniosa (OKLCH) sorteia uma cor de base e constrói as outras a partir de uma harmonia de cores. Escolhe uma Harmonia (Complementar, Análoga, Tríade, Complementar dividida, Tétrade, Quadrado, Monocromática) ou deixa Surpreende-me para teres uma harmonia diferente de cada vez.
3. Clica em Gerar cores. Cada cartão mostra a cor com os códigos HEX, RGB e HSL; os pequenos botões HEX, RGB e HSL copiam o código correspondente.
4. Clica em Bloquear nas cores que queres manter e depois novamente em Gerar cores: só as cores desbloqueadas mudam. Clica outra vez no botão para desbloquear uma cor.
5. Escolhe um formato em Exportar como (Lista HEX, Variáveis CSS, Variáveis SCSS, Matriz JSON ou Cores Tailwind) e usa Copiar ou Transferir para levares o conjunto completo.

Como as cores são escolhidas

No modo Aleatório num intervalo, a matiz, a saturação e a luminosidade são sorteadas uniformemente dentro dos intervalos que defines e depois convertidas de HSL para RGB com a mesma fórmula que os navegadores usam para hsl(). O intervalo de matiz pode dar a volta pelo vermelho: de 330 a 30 dá rosas, vermelhos e laranjas, passando por 0°. Algumas definições úteis:

• Tons pastel: saturação 40–80 %, luminosidade 75–90 %.
• Tons escuros e suaves: saturação 10–40 %, luminosidade 15–35 %.
• Só azuis: matiz 190–250.
• Cores quentes: matiz de 330 a 60.

No modo Paleta harmoniosa (OKLCH), a ferramenta trabalha em OKLCH, um modelo de cor percetual em que passos iguais de luminosidade parecem iguais aos olhos. A primeira cor bloqueada é usada como base; se nada estiver bloqueado, é sorteada uma base de luminosidade média e bastante saturada. As outras cores tomam os ângulos de matiz da harmonia (por exemplo +120° e +240° na tríade), com uma pequena variação aleatória de matiz, luminosidade e croma para que cada clique dê um resultado novo. Quando pedes mais cores do que a harmonia tem matizes, as cores extra reutilizam os ângulos com variantes mais claras e mais escuras. A monocromática mantém uma só matiz e distribui a luminosidade do escuro ao claro.

As cores que ficam fora do que um ecrã sRGB consegue mostrar são trazidas de volta reduzindo o croma, por isso cada código HEX que copias é uma cor real e visível.

Onde as cores aleatórias ajudam

As cores aleatórias dão jeito para avatares e gráficos provisórios, dados de teste, arte generativa, exploração de design quando estás bloqueado perante uma página em branco, ou para escolher uma cor para um projeto, uma equipa de jogo ou uma etiqueta. O bloqueio permite usar a ferramenta como uma slot machine: mantém o que funciona e roda o resto. A aleatoriedade vem do gerador criptográfico do teu navegador, e nada é enviado para lado nenhum.