Gerador de Cor Aleatória

Uma cor nova sempre que a inspiração acaba

Escolher uma cor do nada é surpreendentemente difícil. Diante dos milhões de tons que uma tela pode exibir, a maioria de nós recorre aos mesmos azuis e cinzas familiares repetidamente. Um gerador de cor aleatória quebra esse hábito ao entregar uma cor que você nunca teria escolhido sozinho, o que muitas vezes é justamente a faísca de que um design precisa. Toque no botão e esta ferramenta preenche uma amostra grande com uma cor aleatória e mostra os seus códigos exatos em três formatos — HEX, RGB e HSL — prontos para usar. Tudo roda no seu navegador, então uma cor nova aparece no instante em que você pede e nada é enviado a lugar algum.

A ferramenta é propositalmente limpa. Há uma amostra grande para você realmente ver a cor em um tamanho decente, os seus códigos embaixo, e um único botão para gerar outra. Clique no código HEX e ele é copiado direto para a área de transferência, pronto para colar em um app de design, uma folha de estilo ou um documento. Continue tocando para percorrer quantas cores quiser até uma chamar a sua atenção.

HEX, RGB e HSL explicados

Os três códigos abaixo da amostra são apenas formas diferentes de escrever a mesma cor, e cada um é útil no seu contexto. HEX é o código de seis caracteres que você vê em todo lugar no design web, escrito com uma cerquilha, como #3A7BD5. É compacto e é o que a maioria dos sites e ferramentas de design espera. RGB descreve a cor como três números — a quantidade de luz vermelha, verde e azul, cada uma de 0 a 255 —, o que espelha como as telas de fato constroem a cor misturando esses três canais. HSL adota uma abordagem mais humana, descrevendo uma cor pelo seu matiz (a sua posição na roda de cores), pela sua saturação (o quão viva ou acinzentada ela é) e pela sua luminosidade (o quão perto do branco ou do preto). O HSL é especialmente útil quando você quer ajustar uma cor, porque você pode aumentar a luminosidade para obter uma versão mais clara ou baixar a saturação para suavizá-la sem chutar números crus.

Ter os três lado a lado significa que você pode pegar o formato que o passo seguinte precisa. Um desenvolvedor web geralmente copia o código HEX, alguém trabalhando em um app de foto ou ilustração pode preferir RGB, e um designer refinando uma paleta muitas vezes pensa em HSL. Todos descrevem exatamente a mesma cor na sua tela.

Onde uma cor aleatória ajuda

O uso mais comum é a simples inspiração. Quando você está encarando uma tela em branco, uma cor realmente inesperada pode sugerir uma direção que você não teria encontrado escolhendo tons com cautela. Designers usam cores aleatórias como pontos de partida para paletas, e ajustam a partir daí. Artistas e amadores as usam como uma restrição criativa divertida — desafiando-se a construir algo em torno de uma cor escolhida para eles. Até só percorrer cores pode ajudar você a descobrir tons de que gosta e para os quais nunca teria digitado um código.

Há usos práticos também. Desenvolvedores e testadores às vezes precisam de cores de preenchimento para preencher um mock-up ou para distinguir elementos na tela enquanto montam um layout, e uma cor aleatória com um código copiável é mais rápida do que abrir um seletor de cores completo. Professores e pais usam uma cor aleatória como um estímulo brincalhão, e qualquer um aprendendo sobre códigos de cor pode usar o gerador para ver como o mesmo tom fica escrito de três formas diferentes, o que torna a relação entre os formatos muito mais fácil de entender.

Transformando uma cor em uma paleta

Uma única cor aleatória muitas vezes é só o começo. Depois de ter uma de que gosta, o código HSL facilita montar uma pequena paleta em torno dela à mão. Mantenha o matiz e ajuste a luminosidade para cima e para baixo para criar versões mais claras e mais escuras da mesma cor para fundos e texto. Ou desloque o matiz por um valor fixo para achar cores que ficam ao lado dela ou opostas a ela na roda de cores, que é a base de muitos esquemas de cores clássicos. Como o gerador dá os valores HSL exatos, você tem um ponto de partida preciso em vez de uma impressão vaga.

Isso torna a ferramenta útil não apenas para achar uma cor, mas para dar início a um esquema inteiro. Gere até uma cor parecer certa, copie os seus códigos, e use-os como a âncora de onde o resto da sua paleta cresce.

Privado, instantâneo e grátis

Não há cadastro, custo nem anúncios no caminho. O gerador inteiro é um pequeno trecho de código que roda no seu próprio dispositivo, e é por isso que ele produz uma cor nova no instante em que você toca e continua funcionando sem conexão com a internet. Nada é enviado, registrado ou compartilhado; as cores que você gera existem apenas na sua tela e a sequência zera quando você recarrega a página.

Para usá-lo, toque no botão para uma cor aleatória, olhe a amostra, e leia os seus códigos HEX, RGB e HSL abaixo. Quando achar uma que quer, clique no código HEX para copiá-lo, depois cole onde precisar. Gere quantas vezes quiser — cada cor é um sorteio novo e imparcial de toda a gama que a sua tela consegue mostrar.