Redimensionar imagem por porcentagem

Você informa a largura e a altura originais mais o percentual, e ela devolve as dimensões resultantes arredondadas para pixels inteiros, junto com a contagem final de megapixels. É aritmética pura — nenhuma imagem é enviada, processada ou armazenada — por isso funciona instantaneamente no seu navegador e de forma idêntica pela API quando você precisa dela dentro de um script de build, um pipeline de miniaturas ou um cálculo de layout que deve saber a caixa exata que uma imagem ocupará antes mesmo de ela existir.

Por que redimensionar por percentual é enganosamente simples

Escalar uma imagem para um percentual parece uma única multiplicação, mas são os detalhes que decidem se o seu layout quebra. Cada lado precisa ser escalado de forma independente e arredondado para um pixel inteiro, porque não existe 640,5 pixels. Arredonde 1920 por 33 por cento de forma ingênua e você obtém 633,6, que nenhum renderizador aceita; esta calculadora devolve 634. A regra de arredondamento importa mais em imagens pequenas: reduzir um ícone de 11 pixels para 15 por cento resulta em 1,65 pixels, e a resposta honesta é 2, não um 1 truncado que distorce silenciosamente a proporção. Obter esses números antes de tocar na imagem permite pré-alocar o tamanho correto da tela em um trabalho de miniaturas, escrever os atributos width e height corretos no seu HTML para que a página não se reorganize quando a imagem carregar, e verificar se um redimensionador em lote produziu o que você pediu. A ferramenta de redimensionar imagem por percentual faz exatamente essa matemática, de forma determinística, então a resposta que você vê no navegador é byte a byte a resposta que a API devolve ao seu código.

Como o cálculo funciona

A fórmula é uma linha por dimensão: novo lado igual ao lado original vezes o percentual dividido por cem, arredondado para o pixel inteiro mais próximo. Um percentual de 50 reduz a imagem pela metade, 100 a deixa inalterada e 250 a amplia duas vezes e meia. Largura e altura usam o mesmo fator, e é isso que preserva a proporção — exceto pelo erro de arredondamento subpixel, inevitável quando pixels inteiros não conseguem expressar a razão exata. O resultado também inclui a contagem de megapixels da saída, que é o número que realmente prevê o tamanho do arquivo e o custo de memória: escalar para 50 por cento não reduz os pixels pela metade, reduz a um quarto, porque a área cresce com o quadrado dos lados. O percentual precisa ser positivo; zero ou um valor negativo é rejeitado como entrada inválida, em vez de produzir silenciosamente uma imagem de dimensão zero, e um lado calculado nunca pode ficar abaixo de um pixel. Todos os exemplos desta página foram gerados executando o manipulador real, então o que você lê é o que você obtém.

Onde ele se encaixa em um fluxo de trabalho real

Desenvolvedores front-end o usam para calcular entradas de srcset responsivas: a partir de um original de 2400 pixels, as variantes de 25, 50 e 75 por cento saem com 600, 1200 e 1800 pixels, e esses números vão direto para a marcação. Designers o usam quando um cliente pede uma foto a 30 por cento para uma newsletter e alguém precisa confirmar que o resultado ainda atende à largura mínima do modelo de e-mail. Engenheiros de backend chamam a API dentro de verificações de pipeline, comparando as dimensões que um redimensionador produziu com as que deveria ter produzido, e reprovando o trabalho quando elas divergem. Como a capacidade é matemática pura, sem manipulação de arquivos, executá-la muitas vezes não custa nada: a versão do navegador nesta página é gratuita e ilimitada, e a API cobra apenas US$ 0,002 por chamada quando você a automatiza. Se você precisa dos pixels em si transformados, e não das dimensões calculadas, essa é outra capacidade; esta existe para que a etapa de planejamento seja exata, rápida e barata o suficiente para rodar em cada imagem do lote.