O que é um seletor de cores de imagem?

Um seletor de cores de imagem, também chamado de conta-gotas, lê a cor de um pixel em uma imagem. Designers usam essa ferramenta para combinar uma cor de marca a partir de um logotipo, criar uma paleta com base em uma foto ou verificar a tonalidade exata em uma captura de tela de um site ou aplicativo. Como a cor é lida a partir dos dados do pixel, o valor é exato, e não uma estimativa visual.

Descrição da ferramenta

Esta ferramenta permite abrir uma imagem ou colar uma captura de tela da área de transferência e clicar em qualquer ponto dela para selecionar uma cor. Uma lupa de ampliação acompanha o ponteiro e mostra os pixels ao redor, para que você possa selecionar exatamente o pixel desejado. Cada clique adiciona um ponto numerado, e a cor de cada ponto é exibida no formato de saída escolhido, pronta para ser copiada.

Recursos

  • Selecione cores de imagens PNG, JPEG, WebP, GIF, BMP e AVIF ou cole uma imagem com Ctrl+V
  • Lupa de ampliação com a cor sob o ponteiro
  • Ampliação de até 3200%, com pixels nítidos para pequenos detalhes e ícones
  • Amostra de um ponto ou média de uma área de 3 × 3 a 101 × 101 pixels, como o conta-gotas dos editores de imagem
  • Copie cada cor nos formatos HEX, RGB, HSL, HWB, CMYK, LAB e outros
  • Marcadores numerados na imagem para cada ponto selecionado
  • Exibe a opacidade de pixels semitransparentes
  • Mova o último ponto pixel a pixel usando as teclas de seta

Como funciona

A imagem é decodificada no seu navegador e desenhada em uma tela de desenho, e a cor é lida a partir dos pixels dessa tela. As cores são convertidas para sRGB, o espaço de cores da web, para que os valores correspondam à aparência da imagem na página e possam ser usados diretamente em CSS. Com uma amostra média, as cores dos pixels da área são calculadas em média, ponderadas pela opacidade, para que pixels transparentes não escureçam o resultado. A imagem nunca é enviada.

Dicas

  • Fotos e imagens JPEG contêm ruído, portanto os pixels vizinhos geralmente apresentam pequenas diferenças. Use uma média de 3 × 3 ou 5 × 5 para obter a cor que você vê, em vez de usar um único pixel com ruído.
  • Para elementos gráficos planos, como logotipos, ícones e capturas de tela, use a amostra de um ponto para obter a cor exata.
  • Alterar o tamanho da amostra atualiza as cores de todos os pontos que você já selecionou.
  • Para arquivos GIF, as cores são selecionadas a partir do primeiro quadro.