Calculatrice de rapport d'aspect

Calculez les rapports d'aspect des images et vidéos. Entrez deux valeurs pour trouver la troisième, ou choisissez un rapport prédéfini pour les tailles vidéo et médias sociaux courants.

Common presets

Aspect Ratio

16:9

Decimal

1.7778

Percentage (W/H)

177.78%

Visual preview

16:91,920px1,080px

CSS

aspect-ratio: 16 / 9;

Comment utiliser Calculatrice de rapport d'aspect

  1. 1Entrez la largeur et la hauteur de votre image ou vidéo.
  2. 2Le rapport d'aspect et la fraction simplifiée s'affichent instantanément.
  3. 3Ou choisissez un rapport prédéfini et entrez une dimension pour calculer l'autre.
  4. 4Affichez les résolutions courantes pour le rapport sélectionné.
ZenovayAnalytics

Voyez qui est sur votre site en ce moment.

  • Suivi des visiteurs en temps réel
  • Vie privée d'abord, sans bandeau cookies
  • Installé en deux minutes
Découvrir Zenovay

Questions fréquemment posées

Qu'est-ce qu'un rapport d'aspect ?
Un rapport d'aspect est la relation proportionnelle entre la largeur et la hauteur d'une image ou vidéo, exprimée sous la forme L:H. Par exemple, 16:9 signifie que pour chaque 16 unités de largeur, il y a 9 unités de hauteur. Ratios courants : 16:9 (vidéo HD grand écran, YouTube), 4:3 (ancien téléviseur/moniteur, iPad en paysage), 1:1 (carré, Instagram), 9:16 (vidéo verticale, TikTok/Reels), 3:2 (photos DSLR, film 35 mm), 21:9 (cinéma ultra-large).
Pourquoi les rapports d'aspect sont-ils importants pour le Web et la vidéo ?
Les rapports d'aspect sont importants pour : (1) Intégration vidéo — utiliser le mauvais rapport cause des barres noires ou un étirement. (2) Optimisation d'image — rogner les images au rapport d'affichage exact avant de les télécharger pour éviter le rognage côté navigateur. (3) CSS — définir aspect-ratio: 16/9 sur un conteneur garantit qu'il maintient toujours ses proportions quel que soit sa largeur. (4) Médias sociaux — chaque plateforme a des ratios différents requis pour un affichage optimal (Twitter : 16:9 ou 1:1, Instagram : 1:1, 4:5 ou 9:16).
Comment maintenir le rapport d'aspect en CSS ?
CSS moderne : aspect-ratio: 16 / 9 directement sur l'élément. La hauteur de l'élément correspondra automatiquement à sa largeur au ratio donné. Méthode héritée (padding hack) : définir height: 0 et padding-bottom: 56.25% sur un conteneur (56.25% = 9/16 × 100%) — cela fonctionne dans les anciens navigateurs. Pour les vidéos réactives, enveloppez dans une div avec aspect-ratio: 16/9 et définissez l'iframe/vidéo sur width: 100%; height: 100%.
Quelle résolution dois-je utiliser pour différents rapports d'aspect ?
16:9 — 1280×720 (720p HD), 1920×1080 (1080p Full HD), 3840×2160 (4K UHD), 2560×1440 (2K QHD). 4:3 — 1024×768, 1280×960, 800×600. 1:1 — 1080×1080 (Instagram). 9:16 — 1080×1920 (Stories/Reels/TikTok). 3:2 — 1920×1280, 2400×1600. 21:9 — 3440×1440, 2560×1080. Pour les images Web, servez à 2× la taille d'affichage CSS pour les écrans rétine.
Comment calculer une dimension manquante ?
Si vous connaissez la largeur (L) et le rapport d'aspect (L_ratio:H_ratio), la hauteur est : H = L × (H_ratio / L_ratio). Par exemple, 1920 px de large à 16:9 → H = 1920 × (9/16) = 1080 px. Si vous connaissez la hauteur, la largeur est : L = H × (L_ratio / H_ratio). Cette calculatrice gère automatiquement tous ces calculs — entrez simplement deux valeurs quelconques.