Gerador de aspect-ratio CSS
Digite uma largura e uma altura para obter instantaneamente o valor CSS aspect-ratio correspondente, simplificado e com prévia visual. O cálculo é feito inteiramente no seu navegador, nada é enviado a um servidor.
Como funciona
A propriedade CSS aspect-ratio permite manter automaticamente as proporções de um elemento (imagem, vídeo, contêiner) mesmo quando a largura muda, sem recorrer a truques de padding em porcentagem. Esta ferramenta calcula a proporção a partir das dimensões informadas, simplifica-a quando possível e exibe uma prévia do retângulo resultante.
Por que usar aspect-ratio em vez de uma altura fixa?
Uma altura fixa em pixels quebra o layout em uma tela mais estreita ou mais larga; o aspect-ratio mantém a proporção correta entre largura e altura, qualquer que seja o tamanho real do elemento, o que é especialmente útil para vídeos responsivos, cartões de imagem ou miniaturas de galeria.
O que significa a proporção simplificada exibida?
A ferramenta reduz automaticamente sua proporção entre largura e altura à forma mais simples (por exemplo, 1920 / 1080 vira 16 / 9) por meio do máximo divisor comum, o que gera um valor mais legível e mais fácil de reutilizar na sua folha de estilos.
Processamento 100% local: o cálculo e a prévia são executados apenas no seu navegador.