imgglide

Pegar códigos de cor de uma imagem

Solte uma imagem e toque ou clique onde quiser uma cor. Cada cor capturada aparece em quatro formatos, e as cores principais da imagem ficam logo abaixo, como uma paleta pronta.

Abra uma imagem e toque ou clique nela para capturar uma cor.

ou solte o arquivo aqui

Você também pode colar uma imagem com Ctrl+V (Command+V no Mac).

Seus arquivos são processados no seu próprio aparelho e nunca são enviados.

Como usar

  1. Abra uma imagem com “Escolher arquivo” ou soltando-a na página. Para uma captura de tela, cole com Ctrl+V (ou Command+V no Mac) ou use “Colar imagem”, se o navegador mostrar esse botão.
  2. Toque ou clique no ponto que quiser. Com o mouse, uma lupa acompanha o ponteiro; no celular, pressione, segure e arraste para vê-la acima do dedo e levante o dedo para capturar.
  3. Leia os valores em “Cor capturada”: “HEX”, “RGB”, “HSL” e “CMYK (aprox.)”. Cada linha tem o próprio botão de copiar.
  4. Role até “Cores principais” e ajuste “Cores” para qualquer valor de 5 a 10. Clique em uma amostra para ver os códigos dessa cor em “Cor capturada”.
  5. “Copiar lista HEX” dá um código por linha, “Copiar como CSS” dá propriedades personalizadas e “Salvar como PNG” dá uma imagem da paleta. “Abrir outra imagem” carrega a próxima.

O que faz

  • Lupa de 11 × 11 pixels

    Passe o mouse ou segure e arraste numa tela de toque, e uma lupa mostra uma grade de 11 × 11 pixels, com o pixel-alvo destacado numa caixa e o código HEX embaixo. Ela fica ao lado do ponteiro no computador e acima do dedo no celular, para você ver qual vizinho está prestes a capturar.

  • Quatro formatos, um clique para cada

    Toda cor capturada aparece como HEX, RGB, HSL e CMYK, e cada linha tem o próprio botão de copiar. Um pixel semitransparente ganha um HEX de oito dígitos, além de valores RGBA e HSLA, com a opacidade escrita em porcentagem.

  • As últimas 12 cores

    “Cores recentes” mantém as suas doze últimas capturas e armazena só os códigos HEX delas neste navegador. Clique em uma para trazê-la de volta, copie-a ou clique em “Limpar” para esvaziar a lista.

  • Cores principais e a parcela de cada uma

    A paleta encontra de 5 a 10 cores dominantes, começando em 6. Cada uma vem com a sua parcela da imagem, escrita em porcentagem e desenhada como uma barra proporcional. Elas são calculadas numa cópia reduzida a 256 pixels no lado maior, e pixels quase transparentes são ignorados.

  • Paleta pronta para código ou slides

    A versão em CSS é um bloco :root com --color-1, --color-2 e assim por diante, cada um seguido da sua porcentagem como comentário. O PNG mostra uma amostra por cor, com o código HEX e a parcela embaixo, e usa o nome do seu arquivo com -palette no final.

  • Captura de qualquer ponto da tela

    Nos navegadores que têm conta-gotas, principalmente Chrome e Edge no computador, “Capturar da tela” lê qualquer pixel visível no monitor, de outra janela ou de uma página da web, e não só da imagem aberta. Funciona antes de você abrir qualquer imagem, e a cor vai para “Cor capturada” e para a lista de recentes como qualquer outra captura.

Bom saber

Um seletor de cor responde a perguntas pequenas e práticas. Qual é exatamente o azul deste logotipo? Que tom tem a parede nesta foto de anúncio? Quais cores esta foto de slide usa, para o título combinar? Um código como #E4572E vai direto para o CSS e para as ferramentas de design, RGB e HSL são o que a maioria dos programas gráficos entende, e CMYK é só um ponto de partida para a impressão.

Saiba o que está sendo medido. Cada captura lê um único pixel, então uma foto granulada ou um JPG com ruído de compressão pode devolver uma cor um pouco diferente da do pixel ao lado. Capture alguns vizinhos e compare, ou deixe as cores principais darem a impressão geral. Os valores estão em sRGB, o espaço de cor que os navegadores usam. A linha CMYK é derivada do RGB, o que a torna, na melhor das hipóteses, um palpite; peça uma prova à gráfica quando uma cor precisar sair exata.

Uma imagem pequena é exibida ampliada em até 4×, com as bordas dos pixels bem marcadas, e assim é fácil acertar um pixel específico. O que passar de 16,7 megapixels (4096 × 4096) é reduzido a esse limite antes (a página avisa), e as cores são lidas da cópia reduzida. Pelo teclado, clique na imagem, mova-se com as setas (Shift avança dez pixels de uma vez) e pressione Enter para capturar.

Perguntas frequentes

Onde vejo o valor HEX de um pixel?

Clique no pixel. O valor HEX aparece ao lado da amostra grande em “Cor capturada”, com um botão de copiar só dele.

Dá para tirar uma paleta de uma foto?

Dá. “Cores principais” lista de 5 a 10 cores dominantes da imagem, com a parcela de cada uma. Copie-as como lista ou como CSS, ou guarde uma imagem da paleta com “Salvar como PNG”.

Por que a linha CMYK diz aprox.?

As telas misturam luz e as impressoras misturam tinta, então um número CMYK derivado do RGB é só uma estimativa. Peça uma prova à gráfica antes de confiar nele.

Posso usar uma captura de tela sem salvá-la antes?

Pode. Copie a captura, clique na página e cole. O atalho é Command+V no Mac e Ctrl+V nos demais, e “Colar imagem” faz o mesmo onde o navegador permite.

Por que “Capturar da tela” não aparece para mim?

Seu navegador não tem conta-gotas. O Chrome e o Edge no computador têm; a maioria dos outros, não. Você ainda pode capturar cores de qualquer imagem que abrir.

A página lembra das minhas cores?

As 12 últimas ficam neste navegador como códigos HEX, então estarão lá na próxima vez. “Limpar”, ao lado de “Cores recentes”, esvazia a lista.