Minhas ferramentas

Gerador de cores aleatórias

Uma cor aleatória já está esperando — pressione Espaço para a próxima, copie HEX, RGB ou HSL com um clique.

Como usar

  1. Uma cor já está na tela quando a página abre — o primeiro resultado não precisa de clique.
  2. Pressione Espaço (ou “Gerar”) para a próxima cor. Escolha um estilo primeiro se quiser outro tipo de aleatoriedade: “Equilibrado” fica no meio utilizável do espaço, “Qualquer” sorteia todo o espaço HSL, “Vívido” e “Pastel” miram destaques e fundos suaves.
  3. Copie HEX, RGB ou HSL com seu botão — ou clique na amostra grande para copiar HEX. “Copiar os três” coloca todos os formatos na área de transferência, um por linha.

Exemplo

Configurações

Estilo “Equilibrado”

Um resultado possível

HEX #A5B3C0
RGB rgb(165, 179, 192)
HSL hsl(210, 18%, 70%)

Os valores são aleatórios, então você nunca obterá exatamente estes — confira a forma: HEX é # mais seis dígitos hexadecimais, RGB são três inteiros 0–255, HSL é um matiz em graus mais duas porcentagens. Os selos Aa na amostra mostram como texto preto e branco se leem sobre a cor (contraste WCAG; 21:1 é o melhor, 1:1 é invisível).

Escopo, limites e dúvidas comuns

  • Apenas cores opacas: sem alfa e sem HEX de 8 dígitos. Para transparência, cole o valor no conversor de cores.
  • Três formatos: HEX, RGB e HSL. HSV, CMYK e outros espaços de cor são tarefa do conversor de cores.
  • “Equilibrado”, “Vívido” e “Pastel” são faixas utilizáveis escolhidas à mão em HSL — deliberadamente não são um sorteio matematicamente uniforme. Escolha “Qualquer” para um sorteio uniforme em todo o espaço HSL; cinzas lamacentos e quase-brancos fazem parte do pacote.
  • A aleatoriedade vem de crypto.getRandomValues do seu navegador — criptograficamente forte, mas não um serviço de “aleatoriedade verdadeira” por ruído atmosférico.
  • A faixa de cores recentes vive apenas nesta visita: recarregar a limpa. Nada é enviado, armazenado ou colocado na URL, e o botão de compartilhar compartilha apenas o link da página.
  • Os selos Aa comparam a cor apenas com texto preto e texto branco (luminância relativa WCAG 2.x). Outras cores de texto, sobreposições e gerenciamento de cor estão fora do escopo.
  • O arredondamento é de exibição: converter a mesma cor entre HEX e HSL pode deslocar um canal em 1.

O que as pessoas costumam precisar em seguida, quando a cor está em mãos.

Conversor de cores

Gerador de esquema de cores