HandyWheelO que é um gerador de cores?
Um gerador de cores cria cores aleatórias e mostra os códigos delas, para você usar na hora. É uma fonte rápida de inspiração quando você cria um site, um logotipo, uma apresentação, um ambiente ou uma obra de arte e não sabe por onde começar. Gere uma cor ou uma paleta inteira, guarde as de que gostar e continue gerando.
Como usar
- Cores: escolha uma cor, uma paleta de 5 cores ou 10 cores.
- Estilo: escolha o tipo de cores que você quer (veja abaixo).
- Clique em Gerar cores. Cada amostra mostra seus códigos HEX, RGB e HSL.
- Clique em Copiar embaixo de uma amostra para copiar o código HEX, pronto para colar no CSS, no Figma, no Canva, no PowerPoint ou em outro aplicativo de design.
Tela cheia: clique em Tela cheia no alto da ferramenta para mostrar a paleta em tamanho grande, prático quando você apresenta ideias de cores para um cliente ou uma turma. Pressione Esc para voltar. Em 🎨 Cores e efeitos, você escolhe suas próprias cores de fundo e de botões.
Os quatro estilos
- Harmoniosa: tom aleatório com saturação média a forte e luminosidade média. Essas cores costumam ficar bonitas e combinar entre si. O melhor ponto de partida.
- Pastel: cores suaves e claras, ótimas para fundos, chás de bebê, casamentos e interfaces tranquilas.
- Escura: tons profundos e discretos, úteis para fundos em modo escuro, cabeçalhos e designs com clima.
- Qualquer cor: escolhe uma entre as 16.777.216 cores RGB com a mesma chance. É realmente aleatório, então espere muitos marrons, cinzas e tons apagados, e de vez em quando uma joia.
HEX, RGB e HSL explicados
- HEX (por exemplo
#4F46E5) é o jeito mais comum de escrever uma cor na web. Os três pares de caracteres são as quantidades de vermelho, verde e azul, cada uma de 00 a FF. - RGB (por exemplo
rgb(79, 70, 229)) dá as mesmas quantidades de vermelho, verde e azul como números de 0 a 255. - HSL (por exemplo
hsl(243, 75%, 59%)) descreve uma cor como as pessoas pensam nela: matiz (a posição no círculo cromático, de 0 a 360°), saturação (a intensidade) e luminosidade (o quanto é clara ou escura). É o formato mais fácil para ajustar uma cor à mão, por exemplo uma versão mais clara para o efeito ao passar o mouse.
Quando usar cores aleatórias?
- Design de sites e apps: encontre uma cor de destaque ou uma paleta inicial e refine a partir dela.
- Arte e ilustração: desafie-se a pintar ou desenhar só com a paleta sorteada.
- Marca e apresentações: explore rapidamente caminhos de cor antes de definir as cores da marca.
- Jogos e escola: dê cores aleatórias aos times ou brinque de “como se chama esta cor?”.
- Casa e artesanato: encontre ideias para tricô, patchwork ou combinações de cores num ambiente.
Dicas para usar uma paleta
- Muitos designers usam a regra 60-30-10: uma cor principal em cerca de 60% do design, uma segunda cor em 30% e uma cor de destaque nos 10% restantes.
- Sempre confira o contraste do texto. Texto escuro sobre tons pastel e texto branco sobre cores escuras costumam ser fáceis de ler.
- Copie as cores de que gostou antes de clicar de novo em “Gerar cores”, porque uma nova paleta substitui todas.
Precisa de uma letra ou um número aleatório? Experimente o sorteador de letras ou o sorteador de números.