Como obter uma paleta de cores de uma imagem (HEX)

4 min de leitura · Atualizado em · Última verificação:

Nesta página
  1. Para que serve uma paleta
  2. Passo a passo
  3. Pegue a cor exata de um ponto
  4. Analise só uma parte da imagem
  5. Edite, bloqueie e amplie a paleta
  6. Exportar
  7. Salvar e compartilhar
  8. Confira as cores antes de usar
  9. Privacidade
  10. Experimente agora

Resumo: abra a Paleta de cores da imagem do Imgovo, adicione uma foto, um logotipo ou uma captura de tela, escolha quantas cores quer e clique em Extrair cores. Clique em qualquer ponto da imagem para ler o código HEX exato, edite a paleta e exporte como HEX, variáveis CSS, Tailwind, JSON, paleta do GIMP ou folha de cores em PNG/SVG. Nada é enviado.

Para que serve uma paleta

Uma paleta tirada de uma foto é um jeito rápido de escolher cores que combinam: para um site, uma apresentação, um cartaz ou um logotipo. Também serve para achar o código HEX exato de uma cor em uma captura de tela ou em uma imagem de marca.

Passo a passo

  1. Abra a Paleta de cores da imagem e solte uma imagem na página, clique para escolher uma ou cole da área de transferência. JPG, PNG, WebP, HEIC, TIFF e outros são aceitos. Com Experimente um exemplo você pode dar uma olhada sem arquivo.
  2. Defina as Cores a extrair. Fotos têm muitos tons parecidos: 5 ou 6 cores dão uma paleta de marca limpa e de 10 a 12 mostram mais detalhes.
  3. Escolha como as cores são selecionadas: Cores dominantes, Equilibrado ou Destaques.
  4. Clique em Extrair cores.
  5. Clique em uma amostra para selecioná-la. Os botões da amostra permitem copiar ou bloquear a cor.

Pegue a cor exata de um ponto

Clique ou toque na imagem. Com Pixel exato, o Imgovo lê um pixel da imagem em tamanho real, não de uma cópia reduzida. Nas opções do seletor, você pode usar no lugar a média de 3 × 3 ou 5 × 5 pixels, melhor para fotos com ruído. Depois escolha Adicionar à paleta ou Substituir a cor selecionada.

Você também pode mover a cruz com as setas do teclado e pressionar Enter.

Analise só uma parte da imagem

Escolha Selecionar área e arraste um retângulo sobre a imagem. A paleta é feita só com essa parte; a imagem em si não é cortada. Usar a imagem inteira volta à imagem completa.

Em Mais opções você pode ignorar o quase branco, o quase preto ou a cor escolhida, e definir uma tolerância. Uma cor representativa é a média de um grupo, então pode não existir como pixel isolado. Escolha a opção de cores presentes na imagem se precisar de pixels reais.

Edite, bloqueie e amplie a paleta

  • Edite uma cor selecionada em HEX, RGB, HSL ou OKLCH e dê um nome a ela.
  • Bloqueie as cores que quer manter. Gerar e Aplicar deixam as cores bloqueadas no lugar.
  • Harmonias criam conjuntos complementares, análogos, complementares divididos, triádicos, tetrádicos ou monocromáticos a partir de uma cor.
  • As escalas criam degraus de luminosidade, tons claros, tons escuros ou tons, com 5, 9 ou 11 passos.
  • Variações preenchem as cores que não estão bloqueadas em estilos como pastel, vívido, suave, terroso, monocromático, interface clara e interface escura. A imagem não é analisada de novo.
  • Desfazer e Refazer (Ctrl+Z e Ctrl+Shift+Z) trazem de volta cores e configurações anteriores.

Exportar

Em Exportar você pode copiar ou baixar a paleta como:

  • listas HEX, RGB, HSL ou OKLCH,
  • variáveis CSS,
  • Tailwind CSS v4 ou v3,
  • JSON ou CSV,
  • uma paleta do GIMP (.gpl),
  • uma folha de cores em PNG ou SVG,
  • um PNG com a imagem e a sua paleta.

Salvar e compartilhar

As paletas salvas ficam somente neste navegador; limpar os dados do site as remove, então exporte o arquivo JSON como backup. Copiar link da paleta cria um link que contém só as cores e um nome curto, nunca a imagem. Qualquer pessoa com o link pode ver a paleta.

Confira as cores antes de usar

Uma paleta tirada de uma foto não garante um texto legível. Teste um par de texto e fundo na aba Contraste; veja Como verificar o contraste de cores (WCAG AA e AAA).

Privacidade

As cores são analisadas no seu navegador. A imagem nunca sai do seu dispositivo e não é salva com a paleta.

Experimente agora

Abra a Paleta de cores da imagem, adicione uma imagem e clique em um ponto para obter o código HEX. Se a sua origem for um SVG, converta-o antes em PNG com o Conversor de SVG.

Perguntas frequentes

Como as cores da paleta são escolhidas?

O Imgovo agrupa cores parecidas (o método de corte mediano usado por muitas ferramentas de design) e mostra os grupos mais importantes. Cada amostra é a média do seu grupo, então corresponde ao que você vê. A mesma imagem com as mesmas configurações sempre dá as mesmas cores.

O que significa uma porcentagem como «Cerca de 34 %»?

É a parte dos pixels visíveis analisados que pertencem a esse grupo de cores semelhantes. Não é uma contagem de objetos, e nem todo pixel do grupo tem exatamente esse código HEX. Cores escolhidas, editadas ou geradas não têm porcentagem.

Qual é a diferença entre uma cor representativa e uma cor presente na imagem?

Uma cor representativa é a média de um grupo de pixels parecidos, então pode não aparecer em lugar nenhum da imagem. A opção de cores presentes na imagem usa o pixel real do grupo que fica mais próximo dessa média.

Como obtenho a cor de um ponto exato?

Clique ou toque na imagem. Pixel exato lê um pixel da imagem em tamanho real, não de uma cópia reduzida. Nas opções do seletor, você pode usar a média de 3 × 3 ou 5 × 5 pixels. Depois escolha «Adicionar à paleta» ou «Substituir a cor selecionada».

Onde ficam as paletas salvas?

Somente neste navegador, sem conta. Limpar os dados do site ou usar uma janela privada as remove, então exporte o arquivo JSON se quiser um backup. A imagem original nunca é salva com uma paleta.

Minha imagem é enviada para algum servidor?

Não. As cores são analisadas diretamente no seu navegador, e a imagem nunca sai do seu dispositivo.