Calculateur de Ratio d'Aspect — Redimensionner sans Déformer
Redimensionner une image ou une vidéo sans connaître le ratio d'aspect correct produit des distorsions. Notre Calculateur de Ratio d'Aspect calcule instantanément les nouvelles dimensions en préservant les proportions — pour les images, vidéos, conteneurs CSS et espaces réservés.
Qu'est-ce qu'un ratio d'aspect ?
Le ratio d'aspect est la relation proportionnelle entre la largeur et la hauteur d'un élément, exprimée comme W:H. 16:9 est le standard vidéo HD. 4:3 est le format TV traditionnel. 1:1 est carré. 3:2 est le format photo 35mm.
Comment utiliser notre Calculateur
- Entrez les dimensions originales (largeur et hauteur).
- Saisissez la nouvelle largeur ou hauteur souhaitée.
- L'autre dimension est calculée automatiquement pour préserver le ratio.
- Utilisez le sélecteur de ratios prédéfinis : 16:9, 4:3, 1:1, 21:9, 9:16 (stories).
Cas d'utilisation courants
- Vidéo responsive : Calculez la hauteur CSS pour un iframe 16:9 qui s'adapte à la largeur du conteneur.
- Images de blog : Redimensionnez toutes les images d'en-tête au même ratio pour une cohérence visuelle.
- Miniatures : Calculez les dimensions optimales pour YouTube (1280×720), Instagram (1080×1080) ou Twitter.
- Espaces réservés : Créez des espaces CSS aspect-ratio pour éviter le saut de mise en page (CLS).
Prêt à l'essayer ? Utilisez notre Calculateur de Ratio d'Aspect gratuitement — sans inscription, fonctionne dans votre navigateur.
Questions fréquentes
Comment utiliser la propriété CSS aspect-ratio ?
La propriété CSS native aspect-ratio: 16 / 9; maintient automatiquement le ratio lors du redimensionnement. Supportée par tous les navigateurs modernes, elle remplace les anciennes techniques de padding-bottom.
Quels sont les ratios d'aspect courants pour les réseaux sociaux ?
YouTube/vidéo : 16:9. Instagram Post : 1:1 ou 4:5. Instagram Story/Reels : 9:16. Twitter/X : 16:9. Facebook : 1.91:1.
Comment éviter la distorsion lors du redimensionnement d'images ?
En CSS : object-fit: cover remplit le conteneur sans distorsion (recadrage). object-fit: contain affiche l'image entière avec des barres noires si nécessaire.