Carregue uma imagem e clique em qualquer pixel para obter o HEX, o RGB e o HSL exatos — processado inteiramente no seu dispositivo.
Um conta-gotas de imagem responde a uma pergunta bem corriqueira: que cor exata é aquele pixel? Um logotipo que chegou em PNG, a captura de tela do site de outra pessoa, uma foto cujo céu você quer reproduzir num gradiente — em todos esses casos a cor está ali na tela, mas o código não. Esta ferramenta carrega a imagem num canvas na sua própria máquina e lê os valores brutos dos pixels de volta.
A mecânica é simples e vale conhecer. O arquivo é lido com FileReader como um Data URI, desenhado uma vez num canvas na resolução nativa, e cada leitura é uma chamada getImageData num único pixel — os mesmos quatro bytes (vermelho, verde, azul e alfa) que o navegador já mantém na memória. Como o canvas guarda a resolução original enquanto a página a exibe redimensionada, as coordenadas do ponteiro são convertidas de volta para coordenadas da imagem antes da leitura, então o pixel em que você clica é o pixel que você recebe, mesmo numa foto de 4000 pixels de largura. A lupa redesenha uma vizinhança de onze por onze com a suavização de imagem desligada, e é por isso que você vê quadradinhos nítidos em vez de um borrão; o HSL é derivado da tripla RGB com a fórmula padrão de setor de matiz. Se um pixel for totalmente transparente, a ferramenta avisa, em vez de informar um preto sem sentido.
Além das imagens, navegadores Chromium expõem a API nativa EyeDropper, então, onde seu navegador oferece suporte, um segundo botão permite amostrar qualquer pixel da tela inteira — útil para cores presas num vídeo, num leitor de PDF ou em outro programa. As últimas oito capturas ficam numa fileira de amostras que você pode clicar para copiar, e o conjunto todo pode ser baixado como um arquivo de texto simples listando o HEX, o RGB e o HSL de cada uma. Sua imagem nunca é enviada: ela é lida localmente, desenhada localmente e descartada quando você fecha a página.
Não. O arquivo é lido pelo seu navegador com FileReader e desenhado num canvas no seu dispositivo. Ele nunca é enviado a um servidor e desaparece no momento em que você fecha a aba.
PNG, JPEG e WebP — qualquer coisa que seu navegador consiga decodificar. São aceitas imagens de até 8000 pixels por lado; arquivos maiores são recusados para que o canvas não esgote a memória do seu dispositivo.
Ele usa a API nativa EyeDropper do navegador para amostrar qualquer pixel da sua tela, não só dentro da imagem carregada. Ele aparece em navegadores Chromium como Chrome, Edge, Opera e Brave; Firefox e Safari ainda não oferecem suporte, então lá o botão simplesmente não é exibido.
Normalmente por um de dois motivos. A compressão JPEG altera pixels perto de bordas nítidas, e o navegador pode aplicar o perfil de cor embutido na imagem ao decodificá-la. Para cores chapadas de marca salvas em PNG, o valor que você obtém é exato.
Não automaticamente — esta ferramenta captura um clique por vez e guarda as últimas oito cores, que você pode baixar num arquivo de texto. Amostrar as áreas dominantes de uma imagem costuma bastar para reconstruir a paleta de uma marca.
O Vai.la transforma qualquer URL em um link curto com estatísticas de cliques, QR Code e seu próprio biolink.
O Vai.la não se responsabiliza pelo uso das ferramentas nem por decisões tomadas com base nos seus resultados.