Bild & Foto

Bildbeschneider

Lade ein Foto hoch und schneide es mit einem von zwölf Seitenverhältnissen zu — Instagram Quadrat, 9:16 Story, 16:9 YouTube Miniaturansicht, Facebook Cover — oder frei. Ziehe das Rechteck, ändere die Größe von jeder Ecke und exportiere in voller Quellauflösung als JPG, PNG oder WebP.

Drop or click to upload an imageJPG, PNG, WebP, GIF, BMP, AVIF — up to 25 MB

Cropping happens in your browser. The image is decoded, masked, and re-encoded locally — nothing is uploaded.

Drag the crop rectangle to reposition it. Drag any corner to resize. The rule-of-thirds grid helps with composition.

Was ist ein Bildzuschnitt?

Ein Bildzuschnitt schneidet ein Foto auf ein Zielrechteck zu – nützlich, um ein Bild auf ein bestimmtes Seitenverhältnis anzupassen, leere Bereiche an den Rändern zu entfernen oder die Komposition auf ein Motiv zu fokussieren. Der knifflige Teil für die meisten Menschen ist nicht die Auswahl, was zugeschnitten werden soll, sondern die richtigen Abmessungen zu erhalten: Instagram möchte ein 1:1 Quadrat oder ein 4:5 Hochformat, Stories und Reels möchten 9:16, YouTube-Thumbnails möchten 16:9, Twitter-Karten möchten 16:9, Facebook-Coverfotos möchten 820×312, und ein freiform Zuschnitt möchte, was Ihr redaktioneller Blick sagt. Dieser Zuschnitt bündelt die gängigen Seitenverhältnis-Voreinstellungen, sodass Sie sich die Zahlen nicht merken müssen, und exportiert in der vollen Quellauflösung, sodass die Ausgabe nicht weicher ist als der Eingang.

Wie man ein Bild zuschneidet

1
Laden Sie Ihr Bild hoch
Ziehen Sie eine JPG-, PNG-, WebP-, GIF-, BMP- oder AVIF-Datei in den Upload-Bereich oder klicken Sie, um von Ihrem Gerät auszuwählen. Das Bild wird unten mit einem Standard-Zuschnittrechteck angezeigt, das 80 % des Rahmens abdeckt, zentriert.
2
Wählen Sie ein Seitenverhältnis
Klicken Sie auf einen beliebigen voreingestellten Chip – Frei für unbeschränkt, 1:1 für Quadrat, 9:16 für Stories, 16:9 für Thumbnails, 4:5 für Instagram-Hochformat oder plattformspezifische Voreinstellungen wie IG Post, IG Story, YouTube, Twitter und FB Cover. Das Zuschnittrechteck schnippt auf das neue Verhältnis.
3
Ziehen und ändern Sie die Größe des Zuschnitts
Ziehen Sie das Rechteck, um es zu bewegen, oder greifen Sie einen der vier Ecken-Griffe, um die Größe zu ändern. Wenn eine Seitenverhältnis-Voreinstellung aktiv ist, bleibt das Rechteck auf diesem Verhältnis gesperrt, während Sie die Größe ändern. Das Rasterüberlagerung im Drittel hilft bei der Komposition.
4
Wählen Sie ein Ausgabeformat und eine Qualität
Wählen Sie JPG (kleiner, verlustbehaftet, am besten für Fotos), PNG (verlustfrei, am besten für Grafiken mit scharfen Kanten) oder WebP (kleiner als JPG bei gleicher Qualität). Für JPG und WebP ziehen Sie den Qualitätsregler; PNG ist immer verlustfrei.
5
Laden Sie den Zuschnitt herunter
Klicken Sie auf Zuschnitt herunterladen. Der Browser zeichnet den zugeschnittenen Bereich aus dem Bild in Originalauflösung auf eine frische Leinwand mit genau den Pixelabmessungen des Zuschnitts, kodiert es und löst einen Download mit den Abmessungen im Dateinamen aus.

Wie das Zuschneiden im Browser funktioniert

1. Dekodieren Sie die Quelldatei mit new Image() – der Browser verarbeitet JPG/PNG/WebP/GIF/BMP/AVIF nativ.
2. Rendern Sie die Quelle über <img> mit object-fit: contain in einem seitenverhältnis-gesperrten Container.
3. Das Zuschnittrechteck wird in Quellauflösungs-Pixeln (x, y, w, h) gespeichert, nicht in Vorschau-Pixeln.
4. Beim Ziehen/Ändern der Größe werden die Zeiger-Deltas durch source.width / preview.width skaliert, um Vorschau → Quelle zuzuordnen.
5. Beim Exportieren zeichnen Sie auf eine frische Leinwand: ctx.drawImage(img, x, y, w, h, 0, 0, w, h).
6. Kodieren Sie über canvas.toBlob(format, quality) und lösen Sie einen Download aus.

Das Speichern des Zuschnitts in Quellauflösungs-Koordinaten (anstatt in Vorschau-Koordinaten) ist das entscheidende Detail – es bedeutet, dass die Ausgabe genau so scharf ist wie die Originaldatei im zugeschnittenen Bereich, ohne Neuberechnung. Die Vorschau kann sich frei mit der Seitenbreite skalieren, das Zuschnittrechteck skaliert visuell mit, aber die zugrunde liegenden Zahlen sind immer im Quellraum. Die 9-Argument-Form von drawImage ermöglicht es uns, ein bestimmtes Quellrechteck auf eine Ziel-Leinwand mit denselben Abmessungen zu ziehen, was eine 1:1 Pixelkopie des zugeschnittenen Bereichs erzeugt.

Referenz: MDN — CanvasRenderingContext2D.drawImage

Häufige Zuschneideaufgaben

Ziel	Empfohlene Voreinstellung
Quadratischer Instagram-Beitrag aus einem Landschaftsbild	Wählen Sie IG Post (1:1). Ziehen Sie das Rechteck, um Ihr Motiv in der sicheren Zone zu halten – die UI von Instagram überlagert Teile der Ecken. 1:1 sieht bei den meisten Landschaftsbildern eng aus – ziehen Sie 4:5 für einen kompositionell großzügigeren Hochformat-Zuschnitt in Betracht.
Vertikale Story oder Reel aus einem Landschafts-Video-Still	Wählen Sie IG Story (9:16). Ändern Sie die Größe des Zuschnitts, um sich auf das Motiv zu konzentrieren – vertikale Kompositionen müssen normalerweise die Seiten verlieren. 9:16 gilt auch für Reels, TikTok, YouTube Shorts und Snapchat.
16:9 YouTube-Thumbnail bei 1280×720	Wählen Sie YouTube (16:9). Ziehen Sie einen engen Zuschnitt um das Motiv und laden Sie es als JPG mit 90+ Qualität herunter. Wenn die Quelle kleiner als 1280×720 ist, wird der Zuschnitt nicht hochskaliert – verwenden Sie eine höher aufgelöste Quelle für Thumbnails.
Twitter-Beitrag oder LinkedIn-Share-Bild	Wählen Sie Twitter (16:9). Komponieren Sie mit text-sicheren Rändern; beide Plattformen können leicht auf verschiedenen Oberflächen zuschneiden. 16:9 funktioniert auch für die meisten Desktop-Blog-Hero-Bilder.
Profil / Avatar aus einer breiteren Aufnahme	Wählen Sie 1:1, ziehen Sie einen engen Zuschnitt, der auf das Gesicht zentriert ist. Exportieren Sie als PNG, wenn der Avatar eine transparente UI überlagern soll. Die meisten Plattformen schneiden Avatare weiter in einen Kreis — halte dein Motiv von den Ecken fern.
Facebook-Seiten-Coverfoto	Wähle FB Cover (820×312 Verhältnis). Achte auf die Seiteninfo-Überlagerung unten links und die Profilbild-Überlagerung unten rechts. Facebook rendert Coverfotos für mobile Geräte neu — halte den Fokuspunkt zentriert.
Drucke ein 4×6 Foto aus einer größeren digitalen Datei	Wähle 3:2. Komponiere, exportiere dann als PNG oder JPG in hoher Qualität und sende es an eine Druckerei. 3:2 ist auch das native Format von 35mm-Kameras — sowohl Landschafts- als auch Hochformat funktionieren.

Wann man einen Zuschneider mit Seitenverhältnissen verwenden sollte

Größe eines einzelnen Fotos anpassen, um in Instagram, Story, YouTube, Twitter oder Facebook-Layouts zu passen, ohne den Browser zu verlassen.
Ein Landschaftsfoto als Hochformat für einen Handy-Hintergrund oder einen vertikalen Hero-Bereich umrahmen.
Tote Räume aus einem Screenshot entfernen, bevor du ihn in ein Dokument oder ein Issue-Tracker einfügst.
Generiere ein quadratisches Avatar aus einem breiteren Porträtfoto — wähle 1:1, ziehe einen engen Kopfzuschnitt.
Erstelle ein Bannerbild im benutzerdefinierten Seitenverhältnis (16:9 für einen Blog-Hero, 3:1 für ein Twitter-Banner).
Schneide ein druckfertiges 3:2 oder 4:3 Foto aus einem Handyfoto, bevor du es an ein Fotolabor sendest.
Schneide ein Thumbnail für eine Videodatei in einem bestimmten Seitenverhältnis, ohne Photoshop zu öffnen.

Häufig gestellte Fragen

Skaliert der Zuschneider mein Bild herunter?

Nein. Die Exportleinwand hat genau die Abmessungen der Quellauflösung des Zuschneiderechtecks, und drawImage kopiert den zugeschnittenen Bereich 1:1 ohne Neuberechnung. JPG- und WebP-Codierung wendet verlustbehaftete Kompression an, aber die Pixelabmessungen bleiben unverändert. PNG ist vollständig verlustfrei.

Warum schnippt das Rechteck, wenn ich die Seitenverhältnisse wechsle?

Jedes Seitenverhältnis-Preset sperrt das Verhältnis von Breite zu Höhe des Rechtecks. Das Wechseln der Presets passt das bestehende Rechteck an das neue Verhältnis an, während es auf demselben Bereich zentriert bleibt. Wähle Frei, wenn du das vorherige Rechteck genau beibehalten möchtest.

Kann ich auf eine bestimmte Pixelgröße zuschneiden (z.B. genau 1080×1080)?

Wähle das passende Seitenverhältnis-Preset (1:1 für 1080×1080) und ziehe die Ecke, bis die Größenanzeige das Ziel zeigt. Die X/Y/Breite/Höhe-Statistiken aktualisieren sich live, während du ziehst, sodass du genaue Zahlen erreichen kannst. Der Ausgabedateiname enthält die endgültigen Abmessungen zur Überprüfung.

Warum ist mein Facebook-Cover-Preset 820×312 statt 1640×624?

Das Preset ist ein Verhältnis, keine feste Pixelgröße — es akzeptiert jedes Rechteck mit diesem Verhältnis. Ziehe die Ecke, bis deine Breite die gewünschte Dimension erreicht; 1640×624 (Facebooks empfohlene Retina-Größe) und 820×312 (die alte Größe) teilen sich dasselbe Verhältnis, sodass beide in das Preset passen.

Sind meine Bilder hochgeladen?

Nein. Dekodierung, Zuschneiden und erneute Kodierung erfolgen alle in deinem Browser. Die Bildbytes verlassen niemals die Seite. Du kannst im Netzwerk-Tab überprüfen — es werden keine Anfragen gesendet, wenn du hochlädst, ziehst oder herunterlädst.

Warum wird mein Zuschneider nicht auf eine größere Größe hochskaliert?

Zuschneiden verkleinert ein Bild — es gibt keinen Neuberechnungsschritt, der es hochskalieren würde. Wenn du eine größere Ausgabe benötigst, als das Zuschneiderechteck produzieren kann, beginne mit einer höher aufgelösten Quelle. Browser können technisch über die Zielgröße von drawImage hochskalieren, aber das führt zu einem verschwommenen Ergebnis; dieses Tool bleibt bei der Quellauflösung.

Was ist der Unterschied zwischen Zuschneiden und Größenänderung?

Zuschneiden schneidet Pixel von den Rändern des Bildes ab — was bleibt, hat eine unveränderte Auflösung. Größenänderung behält das gesamte Bild bei, ändert jedoch seine Pixelabmessungen (typischerweise verkleinert). Für Instagram-bereite Ausgaben möchtest du normalerweise beides: zuerst auf das richtige Seitenverhältnis zuschneiden, dann, falls nötig, auf eine kleinere Dateigröße mit dem Bildkompressor komprimieren.

Zuletzt aktualisiert: 2026-04-29

Was ist ein Bildzuschnitt?

Wie man ein Bild zuschneidet

Laden Sie Ihr Bild hoch

Ziehen Sie eine JPG-, PNG-, WebP-, GIF-, BMP- oder AVIF-Datei in den Upload-Bereich oder klicken Sie, um von Ihrem Gerät auszuwählen. Das Bild wird unten mit einem Standard-Zuschnittrechteck angezeigt, das 80 % des Rahmens abdeckt, zentriert.

Wählen Sie ein Seitenverhältnis

Klicken Sie auf einen beliebigen voreingestellten Chip – Frei für unbeschränkt, 1:1 für Quadrat, 9:16 für Stories, 16:9 für Thumbnails, 4:5 für Instagram-Hochformat oder plattformspezifische Voreinstellungen wie IG Post, IG Story, YouTube, Twitter und FB Cover. Das Zuschnittrechteck schnippt auf das neue Verhältnis.

Ziehen und ändern Sie die Größe des Zuschnitts

Ziehen Sie das Rechteck, um es zu bewegen, oder greifen Sie einen der vier Ecken-Griffe, um die Größe zu ändern. Wenn eine Seitenverhältnis-Voreinstellung aktiv ist, bleibt das Rechteck auf diesem Verhältnis gesperrt, während Sie die Größe ändern. Das Rasterüberlagerung im Drittel hilft bei der Komposition.

Wählen Sie ein Ausgabeformat und eine Qualität

Wählen Sie JPG (kleiner, verlustbehaftet, am besten für Fotos), PNG (verlustfrei, am besten für Grafiken mit scharfen Kanten) oder WebP (kleiner als JPG bei gleicher Qualität). Für JPG und WebP ziehen Sie den Qualitätsregler; PNG ist immer verlustfrei.

Laden Sie den Zuschnitt herunter

Klicken Sie auf Zuschnitt herunterladen. Der Browser zeichnet den zugeschnittenen Bereich aus dem Bild in Originalauflösung auf eine frische Leinwand mit genau den Pixelabmessungen des Zuschnitts, kodiert es und löst einen Download mit den Abmessungen im Dateinamen aus.

Wie das Zuschneiden im Browser funktioniert

1. Dekodieren Sie die Quelldatei mit new Image() – der Browser verarbeitet JPG/PNG/WebP/GIF/BMP/AVIF nativ.
2. Rendern Sie die Quelle über <img> mit object-fit: contain in einem seitenverhältnis-gesperrten Container.
3. Das Zuschnittrechteck wird in Quellauflösungs-Pixeln (x, y, w, h) gespeichert, nicht in Vorschau-Pixeln.
4. Beim Ziehen/Ändern der Größe werden die Zeiger-Deltas durch source.width / preview.width skaliert, um Vorschau → Quelle zuzuordnen.
5. Beim Exportieren zeichnen Sie auf eine frische Leinwand: ctx.drawImage(img, x, y, w, h, 0, 0, w, h).
6. Kodieren Sie über canvas.toBlob(format, quality) und lösen Sie einen Download aus.

Häufige Zuschneideaufgaben

Ziel	Empfohlene Voreinstellung
Quadratischer Instagram-Beitrag aus einem Landschaftsbild	Wählen Sie IG Post (1:1). Ziehen Sie das Rechteck, um Ihr Motiv in der sicheren Zone zu halten – die UI von Instagram überlagert Teile der Ecken. 1:1 sieht bei den meisten Landschaftsbildern eng aus – ziehen Sie 4:5 für einen kompositionell großzügigeren Hochformat-Zuschnitt in Betracht.
Vertikale Story oder Reel aus einem Landschafts-Video-Still	Wählen Sie IG Story (9:16). Ändern Sie die Größe des Zuschnitts, um sich auf das Motiv zu konzentrieren – vertikale Kompositionen müssen normalerweise die Seiten verlieren. 9:16 gilt auch für Reels, TikTok, YouTube Shorts und Snapchat.
16:9 YouTube-Thumbnail bei 1280×720	Wählen Sie YouTube (16:9). Ziehen Sie einen engen Zuschnitt um das Motiv und laden Sie es als JPG mit 90+ Qualität herunter. Wenn die Quelle kleiner als 1280×720 ist, wird der Zuschnitt nicht hochskaliert – verwenden Sie eine höher aufgelöste Quelle für Thumbnails.
Twitter-Beitrag oder LinkedIn-Share-Bild	Wählen Sie Twitter (16:9). Komponieren Sie mit text-sicheren Rändern; beide Plattformen können leicht auf verschiedenen Oberflächen zuschneiden. 16:9 funktioniert auch für die meisten Desktop-Blog-Hero-Bilder.
Profil / Avatar aus einer breiteren Aufnahme	Wählen Sie 1:1, ziehen Sie einen engen Zuschnitt, der auf das Gesicht zentriert ist. Exportieren Sie als PNG, wenn der Avatar eine transparente UI überlagern soll. Die meisten Plattformen schneiden Avatare weiter in einen Kreis — halte dein Motiv von den Ecken fern.
Facebook-Seiten-Coverfoto	Wähle FB Cover (820×312 Verhältnis). Achte auf die Seiteninfo-Überlagerung unten links und die Profilbild-Überlagerung unten rechts. Facebook rendert Coverfotos für mobile Geräte neu — halte den Fokuspunkt zentriert.
Drucke ein 4×6 Foto aus einer größeren digitalen Datei	Wähle 3:2. Komponiere, exportiere dann als PNG oder JPG in hoher Qualität und sende es an eine Druckerei. 3:2 ist auch das native Format von 35mm-Kameras — sowohl Landschafts- als auch Hochformat funktionieren.

Wann man einen Zuschneider mit Seitenverhältnissen verwenden sollte

Größe eines einzelnen Fotos anpassen, um in Instagram, Story, YouTube, Twitter oder Facebook-Layouts zu passen, ohne den Browser zu verlassen.

Ein Landschaftsfoto als Hochformat für einen Handy-Hintergrund oder einen vertikalen Hero-Bereich umrahmen.

Tote Räume aus einem Screenshot entfernen, bevor du ihn in ein Dokument oder ein Issue-Tracker einfügst.

Generiere ein quadratisches Avatar aus einem breiteren Porträtfoto — wähle 1:1, ziehe einen engen Kopfzuschnitt.

Erstelle ein Bannerbild im benutzerdefinierten Seitenverhältnis (16:9 für einen Blog-Hero, 3:1 für ein Twitter-Banner).

Schneide ein druckfertiges 3:2 oder 4:3 Foto aus einem Handyfoto, bevor du es an ein Fotolabor sendest.

Schneide ein Thumbnail für eine Videodatei in einem bestimmten Seitenverhältnis, ohne Photoshop zu öffnen.

Häufig gestellte Fragen

Skaliert der Zuschneider mein Bild herunter?

Warum schnippt das Rechteck, wenn ich die Seitenverhältnisse wechsle?

Kann ich auf eine bestimmte Pixelgröße zuschneiden (z.B. genau 1080×1080)?

Warum ist mein Facebook-Cover-Preset 820×312 statt 1640×624?

Sind meine Bilder hochgeladen?

Warum wird mein Zuschneider nicht auf eine größere Größe hochskaliert?

Was ist der Unterschied zwischen Zuschneiden und Größenänderung?

Bildbeschneider

Was ist ein Bildzuschnitt?

Wie man ein Bild zuschneidet

Wie das Zuschneiden im Browser funktioniert

Häufige Zuschneideaufgaben

Wann man einen Zuschneider mit Seitenverhältnissen verwenden sollte

Verwandte Werkzeuge

Häufig gestellte Fragen

Bildbeschneider

Was ist ein Bildzuschnitt?

Wie man ein Bild zuschneidet

Wie das Zuschneiden im Browser funktioniert

Häufige Zuschneideaufgaben

Wann man einen Zuschneider mit Seitenverhältnissen verwenden sollte

Verwandte Werkzeuge

Häufig gestellte Fragen