Seletor de Cores de Imagem Grátis e Gerador de Paletas

Selecione, arraste ou cole uma imagem para capturar cores de pixels localmente, copiar valores HEX/RGB/HSL e gerar uma paleta de cores dominantes.

Clique para o modo cinema
Arraste uma imagem ou clique para escolher

Suporta PNG, JPG, WebP, GIF e BMP. Você também pode colar uma captura de tela com Ctrl+V / Cmd+V

Escolha ou cole uma imagem

As imagens são processadas localmente no seu navegador. Mova a mira após carregar.

Escolha ou cole uma imagem

As imagens são processadas localmente no seu navegador. Mova a mira após carregar.

Como usar

  1. Clique em "Escolher imagem", arraste uma imagem ou cole uma captura de tela com Ctrl+V / Cmd+V.
  2. Mova o cursor ou o dedo sobre a imagem para ver os valores de HEX, RGB e HSL em tempo real e a lupa.
  3. Clique em um ponto que deseja manter; a cor é salva no histórico.
  4. Clique em "Extrair paleta" para gerar uma paleta amigável ao design e copie os valores de cor que precisar.

Exemplo: cole a captura de tela de um produto, capture a cor principal do botão e copie o valor HEX para o seu CSS ou arquivo de design.

Recursos principais

  • Captura de cor de imagem local: as imagens são renderizadas e amostradas no Canvas do navegador, sem envio para servidor.
  • HEX/RGB/HSL em nível de pixel: mova o cursor ou o dedo sobre a imagem para ler os valores de HEX, RGB e HSL em tempo real.
  • Lupa com mira: uma pré-visualização ampliada ajuda a mirar bordas de ícones, detalhes de capturas de UI e pequenos blocos de cor.
  • Gerador de paleta: a amostragem de pixels no navegador extrai até 5 cores dominantes para referência rápida de design.
  • Salvar e copiar rápido: clique na imagem para salvar cores no histórico e clique em qualquer amostra para copiar o código da cor.

Ferramentas relacionadas

Lógica de cálculo

Esta ferramenta decodifica a imagem localmente com o HTML5 Canvas e lê o pixel RGBA na coordenada atual do seletor por meio do getImageData. Os valores HEX, RGB e HSL são formatados a partir desse pixel.

A geração da paleta amostra pixels do Canvas, agrupa cores próximas em faixas simples e as ordena por frequência para retornar até 5 cores dominantes. Isso é útil para paletas rápidas de web e design, mas não promete o gerenciamento de cores absoluto profissional em ICC / P3.

Perguntas frequentes

Minhas imagens são enviadas para algum servidor?

Não. O carregamento da imagem, a captura de cor, a pré-visualização da lupa e a geração da paleta acontecem localmente no seu navegador.

Como obtenho a cor HEX de uma imagem?

Selecione ou cole uma imagem e mova o cursor ou o dedo até o pixel desejado. A cor aparece instantaneamente. Clique na imagem para salvá-la no histórico e clique em uma amostra para copiar o valor HEX.

Quais formatos de cor são suportados?

A ferramenta exibe e copia HEX, RGB e HSL, os formatos mais comuns no design web e no desenvolvimento front-end.

Por que a cor pode diferir um pouco do Photoshop?

O Canvas lê o pixel como renderizado pelo seu navegador. O comportamento do navegador, o gamut do monitor e os perfis de cor embutidos na imagem podem gerar pequenas diferenças.

Consigo capturar cores no celular?

Sim. Em dispositivos com toque, arraste o dedo sobre a imagem para mover a mira e toque ou solte para fixar uma cor.