Selecionar cor de imagem online | HEX, RGB, HSL | Awesome Toolkit

Seletor de Cor em Imagem

Clique em um pixel de uma imagem para obter sua cor em HEX, RGB e HSL. Extraia também uma paleta de cores dominantes.

Por Marshkalk

Solte uma imagem aqui ou

Extrair cores de logos sem arquivos fonte

Situacao comum em agencias de design no Brasil: o cliente envia um logo em JPEG ou PNG sem o arquivo original do Illustrator ou Figma. Esta ferramenta resolve isso em segundos. Carregue a imagem, clique na area colorida e o codigo HEX exato aparece imediatamente. Em grafica brasileiras, a conversao entre Pantone e HEX e uma necessidade frequente: este seletor permite obter o valor HEX de tela de uma amostra fotografada, como ponto de partida para a conversao.

No Instagram brasileiro , uma das plataformas mais ativas do mundo , manter consistencia de cor entre posts, Stories e Reels e fundamental para a identidade visual de marcas e criadores de conteudo. Esta pipette digital agiliza a captura de tons de referencia. Para extrair uma paleta completa de uma imagem, use o Extrator de Paleta.

Formatos de cor

FormatoExemploUso tipico
HEX#1a73e8CSS, HTML, Figma, XD
RGBrgb(26, 115, 232)CSS, processamento de imagem
HSLhsl(217, 79%, 51%)CSS, modo escuro
RGBArgba(26, 115, 232, 1)CSS com transparencia

Limites do seletor ao nivel de pixel

A compressao JPEG introduz artefatos: pixels nas bordas de um logo podem nao representar a cor plana real. Para melhores resultados, use capturas em PNG. Clique no centro da area colorida, nao nas bordas. Perfis de monitor diferentes (sRGB vs. Display P3 em dispositivos Apple) podem introduzir pequenas diferencas; o valor exibido corresponde ao pixel em sRGB. Para trabalhos de impressao em grafica brasileiras, a conversao de HEX para CMYK ou Pantone exige uma ferramenta de gestao de cores separada.

Da cor selecionada ao sistema de design

Com o codigo HEX obtido, cole o valor no Gerador de Paleta para construir uma escala completa de matizes e sombras (config Tailwind CSS ou tokens do Material Design). Em um pais onde mais de 70% dos acessos web sao feitos pelo celular, ter tokens de cor bem definidos e aplicados de forma consistente faz diferenca real na percepcao visual das marcas digitais.