Como identificar uma cor na tela do computador

O mundo digital traduz as cores ao nosso redor em combinações simples de letras e números. Para capturar qualquer cor que desejar, você só precisa obter seu código e poderá replicá-lo.

Uma cor específica chamou sua atenção enquanto navegava na web? Ou você precisa usar um tom específico em seu design para manter as coisas consistentes? Veja como obter o código RGB ou HEX de qualquer pixel em sua tela.

Identifique o valor RGB ou HEX da cor na tela

Identificar o valor RGB ou HEX de uma cor em sua tela não requer um olhar especializado ou uma ferramenta cara. No PC, existem várias maneiras fáceis de obter seu código de cores.

Use um aplicativo para PC

A primeira maneira de captar qualquer cor da tela é usando um aplicativo de computador. Talvez você já tenha este aplicativo em seu PC.

Conta-gotas instantâneo para Windows

Se você precisa pegar códigos de cores com frequência, ter uma ferramenta simples à mão facilitará sua vida. Instant Eyedropper é um aplicativo gratuito exclusivo para Windows a partir de agora.

Depois de instalá-lo, você poderá acessá-lo na bandeja do sistema. Basta pressionar e segurar o botão esquerdo do mouse na cor de sua escolha e soltá-lo. O aplicativo copiará instantaneamente o código de cores para a área de transferência e você poderá colá-lo em qualquer programa que desejar. Instant Eyedropper funciona no Windows XP-10.

Medidor de cor digital para Mac

Digital Color Meter é uma ferramenta semelhante pré-instalada em dispositivos Mac. Abra a pasta Aplicativos e encontre Utilitários. A ferramenta Digital Color Meter deve estar ali.

A execução deste aplicativo transformará seu cursor em um conta-gotas que você pode usar para escolher qualquer cor da tela. O aplicativo exibirá os valores RGB por padrão. Você pode copiá-los e convertê-los em HEX mais tarde ou ajustar as opções para obter a cor exata que deseja.

SIP para Mac

Se você precisar de uma ferramenta mais avançada, pode consultar o SIP, disponível para Mac. O SIP é mais do que um seletor de cores. Ele também oferece uma série de recursos avançados que qualquer web designer apreciará. Você pode editar suas cores facilmente, organizá-las em paletas e alterar seus formatos para atender às suas necessidades.

Infelizmente, o SIP não é uma ferramenta gratuita, mas oferece uma avaliação gratuita. Você pode experimentá-lo para ver se os recursos extras valem o seu dinheiro.

A vantagem desses aplicativos de desktop é que eles podem capturar cores de praticamente qualquer parte da tela. As ferramentas do navegador abaixo só podem fazer isso dentro de páginas da web. Claro, você pode contornar essa restrição carregando uma foto ou uma captura de tela para visualizá-la em seu navegador.

Use seu navegador

A seguinte maneira direta de obter a cor do código RGB ou HEX é simplesmente usar as ferramentas integradas do seu navegador. Você só poderá escolher as cores na página da Web em questão, mas pode usar o Firefox e o Chrome para isso.

Veja onde encontrar a ferramenta seletora de cores do Firefox:

1. Inicie o Firefox e abra o site onde deseja extrair um código de cores.
   
2. Clique no menu do seu navegador (três linhas horizontais) no canto superior direito.
   
3. Encontre as ferramentas do desenvolvedor da Web entre as opções. Pode estar em "Mais ferramentas".
   
   
4. Uma janela será aberta na parte inferior da página. Encontre o ícone do conta-gotas e você poderá copiar códigos de cores com um clique.
   

As etapas são semelhantes no Chrome:

1. Inicie o Chrome e abra o site desejado.
   
   
2. Clique no menu (três pontos verticais) no canto superior direito e encontre as “Ferramentas do desenvolvedor” em “Mais ferramentas”.
   
3. Uma janela será aberta no lado direito da página. Encontre e clique em “Estilos” na segunda seção.
   
4. Em “corpo”, você verá um monte de caixas coloridas. Clique em qualquer um deles para ativar o seletor de cores.
   

Dica: você também pode abrir as ferramentas do desenvolvedor em ambos os navegadores clicando com o botão direito do mouse em qualquer página e escolhendo “Inspecionar”.

Use uma extensão de navegador

Além das ferramentas do desenvolvedor, você também pode usar extensões de navegador úteis para escolher qualquer cor de uma página da web. Confira as seguintes extensões que fazem o trabalho:

• ColorZilla
  
• Conta-gotas ColorPick
  
• Conta-gotas
  

Usar um site

Você não precisa necessariamente de um aplicativo ou extensão para identificar o código RGB ou HEX de uma cor. Se você tem uma imagem específica da qual deseja obter uma cor, também pode usar um site. Inúmeros sites permitem que você carregue uma foto, extraia um código de cores ou até gere uma paleta harmoniosa.

Seletor de cores de imagem do PineTools

Encontre a ferramenta Image Color Picker no site do PineTools e carregue sua imagem. Aumente o zoom, se necessário, para encontrar o pixel que deseja capturar. Você obterá os valores RGB e o código HEX com um simples clique.

Seletor de cores de imagem

O site Image Color Picker oferece várias outras opções além do upload de imagens. Clique em “Usar sua imagem” e escolha para onde deseja importar uma imagem. Você pode clicar em qualquer parte da imagem para obter uma cor específica, mas o site também sugere uma paleta de cores com base na imagem.

Localizador de cores de imagem

Além de um simples seletor de cores, o Image Color Finder também pode funcionar como uma ferramenta criativa. Você pode pixelar a imagem carregada para uma melhor visão geral de suas cores e aumentar o zoom o quanto quiser. O site também sugere automaticamente algumas cores.

Tirar uma captura de tela

Finalmente, você pode identificar o código de cores sem todas as ferramentas mencionadas acima. Em vez disso, você fará uma captura de tela e escolherá a cor a partir daí.

1. Certifique-se de que a cor que você deseja escolher esteja visível na tela.
2. Faça uma captura de tela pressionando o botão Print Screen do teclado (PrntScr, PrtScn, etc.) no Windows ou pressionando e segurando “Shift + Command + 3” ao mesmo tempo no Mac. Sua captura de tela será copiada automaticamente para a área de transferência.
   
   Dica: você também pode capturar apenas uma parte da tela. No Windows, abra a Ferramenta de Recorte no Menu Iniciar. No Mac, use o atalho “Shift + Command + 4”.
3. Abra o MS Paint (ou qualquer outro aplicativo de processamento de imagem) e cole a captura de tela.
4. Encontre a ferramenta conta-gotas e escolha uma cor.
   
5. Clique em “Editar cores” ao lado da paleta de cores no MS Paint. Sob o controle deslizante, você verá os valores RGB da sua cor atual.
   Para transformar esses números em um código HEX, você precisará da ajuda de um site.
6. Vá para RGB to HEX e insira os valores nos campos apropriados.
   
7. Clique em "Converter para Hex" e você receberá seu código.
   

Perguntas frequentes adicionais

Qual a diferença entre RGB e HEX? Qual eu preciso?

Os códigos RGB e HEX expressam as mesmas cores. No entanto, o código que você precisará depende de seu uso pretendido. Os códigos RGB instruem sua tela sobre quanta luz vermelha, verde e azul deve ser emitida para produzir a cor desejada. Os códigos HEX transmitem as mesmas informações, mas na linguagem de codificação.

Um designer ou desenvolvedor provavelmente precisará dos códigos HEX de cores.

Como identifico uma cor em um dispositivo móvel?

Para escolher uma cor na tela do seu dispositivo móvel, você pode baixar um aplicativo ou usar um dos sites mencionados acima. Há também uma ferramenta Color Picker para iOS dentro da ferramenta Markup. Ele também pode fornecer o código HEX da cor.

Obtenha qualquer cor que você vê com apenas um clique

O uso dos códigos de cores RGB ou HEX garante que não haja chance de erro. Graças a essas linguagens de cores universais, você pode manter seus designs consistentes com os mesmos tons. Como existem muitas maneiras de extrair o código de cores na tela, você só precisa encontrar o método mais fácil para você.

Qual ferramenta seletora de cores você prefere? Ou você tem outro método confiável para adicionar? Informe-nos abaixo.