Seitenverhältnis-Rechner

Berechnen Sie Seitenverhältnisse für Bilder und Videos. Geben Sie zwei beliebige Werte ein, um den dritten zu finden, oder wählen Sie ein voreingestelltes Verhältnis für häufige Video- und Social-Media-Größen.

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;

So verwenden Sie Seitenverhältnis-Rechner

  1. 1Geben Sie die Breite und Höhe Ihres Bildes oder Videos ein.
  2. 2Das Seitenverhältnis und die vereinfachte Bruchzahl werden sofort angezeigt.
  3. 3Oder wählen Sie ein voreingestelltes Verhältnis und geben Sie eine Dimension ein, um die andere zu berechnen.
  4. 4Zeigen Sie häufige Auflösungen für das ausgewählte Verhältnis an.
ZenovayAnalytics

Sehen Sie, wer gerade auf Ihrer Seite ist.

  • Besucher-Tracking in Echtzeit
  • Datenschutz zuerst, kein Cookie-Banner
  • In zwei Minuten eingerichtet
Zenovay entdecken

Häufig gestellte Fragen

Was ist ein Seitenverhältnis?
Ein Seitenverhältnis ist die proportionale Beziehung zwischen der Breite und Höhe eines Bildes oder Videos, ausgedrückt als W:H. Zum Beispiel bedeutet 16:9, dass auf je 16 Einheiten Breite 9 Einheiten Höhe kommen. Häufige Verhältnisse: 16:9 (Breitbild-HD-Video, YouTube), 4:3 (ältere TV/Monitor, iPad-Querformat), 1:1 (Quadrat, Instagram), 9:16 (vertikales Video, TikTok/Reels), 3:2 (DSLR-Fotos, 35-mm-Film), 21:9 (ultrabreites Kino).
Warum sind Seitenverhältnisse für Web und Video wichtig?
Seitenverhältnisse sind wichtig für: (1) Video-Einbettungen — die Verwendung des falschen Verhältnisses verursacht Letterboxing oder Dehnung. (2) Bildoptimierung — zuschneiden Sie Bilder auf das genaue Anzeigeverhältnis, bevor Sie sie hochladen, um browsergestützte Zuschneideeffekte zu vermeiden. (3) CSS — das Einstellen von aspect-ratio: 16/9 auf einem Container stellt sicher, dass es immer seine Proportionen beibehält, unabhängig von der Breite. (4) Soziale Medien — jede Plattform hat unterschiedliche erforderliche Verhältnisse für optimale Anzeige (Twitter: 16:9 oder 1:1, Instagram: 1:1, 4:5 oder 9:16).
Wie halte ich das Seitenverhältnis in CSS bei?
Modernes CSS: aspect-ratio: 16 / 9 direkt auf dem Element. Die Höhe des Elements passt sich automatisch an seine Breite im gegebenen Verhältnis an. Ältere Methode (Padding-Hack): setzen Sie height: 0 und padding-bottom: 56.25% auf einem Container (56.25% = 9/16 × 100%) — dies funktioniert in älteren Browsern. Für responsive Videos wickeln Sie sie in ein div mit aspect-ratio: 16/9 ein und setzen Sie das iframe/Video auf width: 100%; height: 100%.
Welche Auflösung sollte ich für verschiedene Seitenverhältnisse verwenden?
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. Für Web-Bilder wird die 2-fache CSS-Displaygröße für Retina-Displays bereitgestellt.
Wie berechne ich eine fehlende Dimension?
Wenn Sie die Breite (W) und das Seitenverhältnis (W_ratio:H_ratio) kennen, beträgt die Höhe: H = W × (H_ratio / W_ratio). Zum Beispiel, 1920px breit bei 16:9 → H = 1920 × (9/16) = 1080px. Wenn Sie die Höhe kennen, ist die Breite: W = H × (W_ratio / H_ratio). Dieser Rechner führt alle diese Berechnungen automatisch durch — geben Sie einfach zwei beliebige Werte ein.