Conta-gotas online
Arraste a imagem para cá
Formatos suportados: JPG, PNG, WebP, GIFClique em qualquer lugar da imagem para selecionar a cor
Precisa saber qual é a cor exata de uma logo, de uma foto ou de uma captura de tela? Envie a imagem, passe o cursor sobre o ponto que interessa e clique. O código da cor vai direto para a área de transferência no formato que você escolher: HEX, RGB, HSL, HSV ou LCH. Não instala nada, e a imagem não sai do seu computador.
Como descobrir a cor de uma imagem
- Envie uma imagem. Arraste para a janela ou clique em “Procurar arquivos”. O conta-gotas aceita JPG, PNG, WebP e GIF.
- Escolha o formato. Acima da imagem, selecione em qual notação quer copiar a cor. HEX costuma servir para a web, RGB é comum em programas gráficos. A ferramenta lembra sua escolha.
- Passe o cursor sobre a cor. Perto do cursor aparece uma lupa com os pixels ampliados, e logo abaixo o código da cor.
- Clique. O código já fica na área de transferência e a cor é salva em Cores escolhidas. Basta colar onde precisar.
Quer testar outra imagem? Arraste-a direto sobre a atual, ou remova-a pelo ícone da lixeira.
O que o conta-gotas online faz
Uma lupa que mostra cada pixel
Um conta-gotas comum só mostra a cor sob o cursor, e acertar a borda fina de uma letra vira loteria. Nossa lupa amplia uma área de 11 × 11 pixels ao redor do cursor e destaca o pixel central. Você vê exatamente onde vai clicar antes de clicar.
Zoom até o pixel
Com os botões de mais e menos, ou com a roda do mouse e Ctrl pressionado, dá para ampliar a imagem em até 64 vezes. Com a Grade ativada, as bordas dos pixels ficam visíveis, então em ícones, pixel art ou texto pequeno você clica exatamente onde quer.
Cor do original, não de uma miniatura
Muitas ferramentas online reduzem a imagem antes e leem a cor de uma prévia, onde pixels vizinhos se misturam. Este conta-gotas trabalha com a imagem em resolução total (até 4096 px no lado maior), então você recebe a cor real do pixel.
Copiar com um clique
Sem selecionar texto nem redigitar números. Cada clique na imagem copia o código no formato escolhido. Se precisar da mesma cor em outra notação, o detalhe da cor mostra os cinco formatos, cada um com seu próprio botão de copiar.
Paleta de cores dominantes
Assim que a imagem carrega, a ferramenta encontra até oito cores que predominam nela e mostra em Cores dominantes. Tons quase idênticos são fundidos, então a paleta não vira cinco variações de cinza, e as partes transparentes de um PNG são ignoradas. A paleta serve como ponto de partida para o esquema de cores de um site, de uma apresentação ou de posts nas redes sociais. Para checar se as cores mantêm contraste suficiente sem depender do matiz, converta a imagem para escala de cinza.
Cores escolhidas sempre à vista
Cada cor em que você clica é salva em Cores escolhidas (as últimas 24). Assim dá para comparar vários pontos da imagem e voltar a eles quando quiser. Em telas grandes, o painel de cores fica logo ao lado da imagem.
Para que serve descobrir o código de cor de uma imagem
- Sites e aplicativos: o cliente mandou a logo só em JPG e você precisa da cor exata da marca para o CSS. Se também precisar de uma versão com fundo transparente, use o removedor de fundo de imagem.
- Design gráfico e redes sociais: você quer que o texto de um post combine com a foto. Pegue a cor direto dela.
- Apresentações e documentos: configure as cores da logo da empresa no PowerPoint, no Google Slides ou no Canva usando HEX ou RGB.
- Checagem de design: confira em uma captura de tela se um botão do aplicativo realmente usa a cor definida no design. Depois confira o tamanho dos arquivos exportados na análise de dimensões de imagens.
- Decoração e moda: você tem uma foto de um tecido ou de uma parede e quer um tom parecido. O código serve como ponto de partida na hora de escolher na paleta da loja de tintas.
Formatos de cor que o conta-gotas retorna
- HEX (
#1373b6): notação usada em HTML, CSS e na maioria das ferramentas gráficas. Veja a documentação do MDN para as variantes curtas e com alfa (em inglês). - RGB (
rgb(19, 115, 182)): a proporção de vermelho, verde e azul, cada uma de 0 a 255. Como funciona a mistura aditiva de cores explica a Wikipédia. - HSL (
hsl(205, 81%, 39%)): matiz, saturação e luminosidade. Fácil de usar para preparar uma variante mais clara ou mais escura. - HSV: matiz, saturação e valor, como no seletor de cor do Photoshop ou do GIMP. A diferença entre HSL e HSV está detalhada na Wikipédia.
- LCH: um modelo que segue como o olho humano percebe as cores. É copiado na notação que o CSS moderno entende (veja a documentação do MDN, em inglês).
O conta-gotas descobre a cor de uma imagem. Se quiser ajustá-la, converter para outros formatos ou buscar tons que combinem com ela, continue na roda de cores.
Perguntas frequentes
Minha imagem é enviada para um servidor?
Não. A imagem é carregada e processada direto no seu navegador, nunca é enviada para lugar nenhum, e nada fica salvo depois que você fecha a página. Dá para usar o conta-gotas até em arquivos internos ou designs ainda não divulgados.Como descubro o código HEX de uma cor em uma foto?
Envie a foto, deixe o formato HEX selecionado acima da imagem e clique no ponto com a cor que procura. O código, por exemplo#75dab2, já fica na área de transferência.
Por que a cor da foto é diferente da realidade?
A câmera altera as cores por causa da iluminação, do balanço de branco e da compressão. O conta-gotas retorna exatamente a cor gravada no arquivo. Em fotos, clique em vários pontos e compare em Cores escolhidas. Se for misturar tinta com base no código, trate-o como uma referência aproximada.O conta-gotas funciona no celular?
Sim. Na tela sensível ao toque, toque no ponto da imagem e o código é copiado como no computador. A lupa perto do cursor não aparece no celular, então dê zoom antes em detalhes pequenos.Qual é a diferença entre HEX e RGB?
Os dois descrevem a mesma cor. O RGB usa três números de 0 a 255, e o HEX escreve os mesmos números em hexadecimal depois do símbolo #. Por exemplo,rgb(255, 87, 51) é o mesmo que #ff5733.