Seletor de cores para capturas de tela

Descubra o código HEX, RGB e HSL exato de qualquer pixel de uma imagem.

Roda no seu navegador
Sem uploads
Sem conta

Carregando a ferramenta no navegador…

O que faz: Seletor de cores para capturas de tela

Acertar no olho a cor de uma marca, de um botão ou de uma linha de gráfico a partir de uma captura de tela é chute. Carregue a imagem, passe o mouse sobre ela e uma lupa amplia uma grade de 11 × 11 pixels para você ver exatamente em qual pixel está. Clique para escolher: a cor aparece em uma amostra grande, com os valores HEX, RGB e HSL, cada um com o seu campo para copiar.

As dez últimas escolhas ficam na linha Recentes, para você comparar alguns tons e voltar a um deles. Bordas suavizadas e degradês variam de pixel para pixel; escolha no meio de uma área de cor chapada. Para descobrir as cores principais de uma imagem inteira, use o Extrator de paleta de cores.

Exemplo

Você escolhe

O exemplo embutido da página de cobrança (Usar exemplo)

Resultado

HEX #3157D5
RGB rgb(49, 87, 213)
HSL hsl(226, 66%, 51%)

O exemplo escolhe um pixel dentro do botão azul Atualizar pagamento.

Como usar: Seletor de cores para capturas de tela

Clique em Escolher arquivo, cole uma captura de tela ou solte uma imagem.
Passe sobre a imagem para ampliá-la e clique no pixel que quiser. Para coordenadas exatas, digite X e Y em Mais opções e clique em Escolher este pixel.
Clique em Copiar para o código HEX, ou copie RGB ou HSL dos campos deles.

Bom saber

Uma captura de tela registra a cor que a sua tela exibiu, depois de qualquer perfil de cor ou do Night Shift. Ela pode ser um pouco diferente da cor no CSS do app ou no arquivo de design.
A compressão JPG muda um pouco as cores, principalmente perto das bordas. Use capturas de tela PNG quando a precisão importar.
A transparência não entra nos códigos. Um pixel semitransparente mostra o alfa abaixo da imagem, mas o HEX é a cor sem ele.

Perguntas sobre Seletor de cores para capturas de tela

Como descubro o código HEX de uma cor em uma imagem?

Carregue a imagem, passe o mouse até a lupa ficar sobre a cor e clique. O código HEX aparece no topo do resultado, com um botão Copiar. As versões RGB e HSL aparecem abaixo dele.

Por que a cor que escolhi é um pouco diferente da cor da marca?

As telas aplicam perfis de cor, e a compressão JPG e a suavização de bordas mudam pixels individuais. Escolha no centro de uma área grande e chapada de um PNG. Se o valor estiver algumas unidades fora, o código do guia da marca é o que vale.

Posso pegar uma cor da minha tela fora do navegador?

Faça primeiro uma captura de tela e cole aqui com Ctrl+V ou Cmd+V. O seletor funciona com qualquer imagem, então uma captura de tela de outro app ou de um arquivo de design funciona do mesmo jeito.