Loading...
Loading...
Adicione setas, chamadas, retângulos, desenhos à mão livre e rótulos em qualquer foto ou captura de tela — arraste para reposicionar, desfaça a qualquer momento, exporte como PNG, JPG ou WebP.
Um anotador de fotos permite que você desenhe sobre uma foto ou captura de tela para destacar, apontar ou rotular algo. Ao contrário de um editor completo, ele não altera os pixels subjacentes — suas marcações vivem como uma camada de formas vetoriais (setas, retângulos, texto, traços à mão livre) que são incorporadas à imagem apenas quando você exporta. Isso o torna perfeito para relatórios de bugs, feedback de design, etapas de receitas, marcação de dever de casa de crianças, anúncios imobiliários e o problema diário de 'veja esta coisa bem aqui'. Esta ferramenta oferece cinco ferramentas (selecionar, texto, seta, retângulo, à mão livre), uma paleta de cores mais um seletor de cores personalizadas, e quatro larguras de traço. Tudo roda no seu navegador, então capturas de tela com conteúdo sensível nunca saem do seu dispositivo.
Arraste um arquivo JPG, PNG ou WebP para a área de upload, ou clique para escolher do seu dispositivo. Capturas de tela, fotos de telefone, fotos de produtos — qualquer coisa que os navegadores possam renderizar funciona.
Use Seta para apontar para algo, Retângulo para contornar, À mão livre para circular ou rabiscado, e Texto para adicionar um rótulo. Escolha uma cor da paleta ou abra o seletor de cores personalizadas para qualquer valor hexadecimal.
Arraste para desenhar setas e retângulos. Arraste com À mão livre para rabiscado. Com a ferramenta Texto, digite seu rótulo primeiro, depois clique na foto para colocá-lo onde você quiser.
Mude para Selecionar, depois arraste qualquer anotação para movê-la. Clique em Desfazer para remover a última, ou clique em uma anotação e pressione Excluir. Limpar tudo apaga a camada em um único passo.
Escolha PNG (sem perdas, recomendado para capturas de tela), JPG (menor, fotos) ou WebP (melhor relação tamanho-qualidade), depois clique em Baixar. As anotações são incorporadas à exportação na resolução original.
1. Decodifique a imagem de origem com createImageBitmap() — nativo, sem biblioteca. 2. Renderize a foto em um canvas na tela na escala de visualização (≤ 900 px no lado mais longo). 3. Cada anotação é armazenada como um objeto tipado (tipo, coords, cor, traço). 4. Na exportação, desenhe a imagem na resolução original em um novo canvas primeiro. 5. Reproduza cada anotação em cima usando ctx.drawImage / strokeRect / etc. 6. Codifique com canvas.toBlob(formato, qualidade) e ofereça como download.
Armazenar anotações como objetos em vez de incorporá-las diretamente nos pixels tem dois benefícios reais. Primeiro, você mantém a foto original intacta — desfazer, excluir e reposicionar são apenas edições de estado, nenhuma ferramenta destrutiva de 'apagar' necessária. Segundo, a exportação usa a resolução original: a visualização na tela pode ser reduzida para 900 pixels, mas quando você clica em Baixar, a ferramenta re-rasteriza tudo contra a imagem original. As coordenadas são armazenadas no espaço da imagem e convertidas em escala na renderização, então uma captura de tela de 4032×3024 produz uma exportação anotada de 4032×3024 com pontas de seta e texto nítidos.
Referência: MDN — CanvasRenderingContext2D
| Foto | Melhores ferramentas para usar |
|---|---|
Captura de tela do aplicativo para um relatório de bug | Retângulo vermelho ao redor da interface quebrada + seta vermelha com um rótulo de texto 'este botão está desalinhado'. Mantenha uma cor de destaque para que a marcação seja lida como uma única mensagem. |
Foto da receita com rótulos passo a passo | Setas amarelas numeradas 1, 2, 3 apontando para os ingredientes + pequenos rótulos de texto para cada um. Tamanho de texto menor (16–24 px) mantém a foto legível por baixo. |
Foto de quadro branco de uma reunião | Círculos à mão livre ao redor de caixas-chave + anotações de texto para contexto ausente. Use uma cor de alto contraste (vermelho ou rosa) para que apareça em quadros brancos ocupados. |
Foto de listagem de imóveis | Retângulos para destacar características (eletrodomésticos de aço inox, piso de madeira, etc.), rótulos de texto curtos. Preto com um contorno sutil lê bem na maioria das fotos de interiores. |
Recorte o assunto de qualquer foto com IA no dispositivo — sem necessidade de upload.
Reduza arquivos JPG, PNG ou WebP no seu navegador com um controle deslizante de qualidade interativo.
Ajuste, filtre, gire e corte fotos no navegador — sem uploads, sem marca d'água.
Componha memes e colagens de capturas de tela com camadas reais — cole, arraste, corte, legendas, exporte.
Última atualização