Wie man ein Bild zu einem Kreis zuschneidet (Profilfotos und Avatare)

Zuletzt aktualisiert: June 28, 2026

Circle crops verwandeln ein quadratisches oder rechteckiges Foto in ein rundes Bild – die Standardform für Avatare, Profilbilder und Logos. Es gibt zwei unterschiedliche Ziele: ein transparentes Circle PNG (für Designzwecke) oder ein Kreis auf einem soliden Hintergrund (für einen fertigen Avatar). Dieser Leitfaden behandelt beides, die „Quadrat-zuerst“-Regel, die das Motiv zentriert hält, und wo Circle Crops tatsächlich verwendet werden.

Kurzantwort: Wie croppt man ein Bild zu einem Kreis?

Die Schlüsselregel: croppt man zuerst auf ein Quadrat mit zentriertem Motiv und wendet dann den Kreis an – andernfalls ist das Motiv im Kreis dezentriert.

Die „Quadrat-zuerst“-Regel

Die meisten Leute croppen direkt zu einem Kreis und stellen fest, dass das Motiv seitlich versetzt ist. Die Lösung besteht darin, zuerst auf ein zentriertes Quadrat zu croppen und es dann rund zu machen. Das Quadrat garantiert, dass das Motiv in der Mitte des späteren Kreises liegt.

Bei einem Gesicht sollte man auf die Augen und Nase zentrieren und nicht auf den ganzen Kopf, da ein Kreis die Ecken abschneidet, wo die Ränder des Kopfes wären. Lasst einen kleinen Rand, damit Kinn und Stirn nicht abgeschnitten werden.

Wo werden Circle Crops verwendet?

Circle Crops sind die Standardform für einige spezifische Anwendungen:

• Avatare und Profilbilder — Die meisten sozialen Plattformen maskieren das hochgeladene Quadrat in einen Kreis.
• Logos — Viele Marken setzen ihr Markenzeichen für App-Icons und Favicons in einem Kreis.
• Team- und Testimonialfotos — Runde Porträts auf „Über uns“-Seiten und Bewertungs-Widgets.
• UI-Elemente — Runde Buttons und Abzeichen (Badges).

Für soziale Profilbilder müssen Sie normalerweise keinen Kreis selbst erstellen – laden Sie einfach ein zentriertes Quadrat hoch, und die Plattform maskiert es. Erstellen Sie den Kreis nur selbst, wenn Sie ein fertiges rundes Bild für Design oder Druck benötigen.

Wie wählt man die Methode?

Methode 1: Transparenter Circle PNG

Ein transparenter Kreis behält die runde Form mit transparenten Ecken bei, sodass er auf jeden Hintergrund gelegt werden kann. Exportieren Sie als PNG (JPEG hat kein Alpha).

## Crop to a centered 600x600 square, then apply a circular alpha mask
magick input.jpg -gravity center -crop 600x600+0+0 +repage \
  \( +clone -threshold -1 -negate -fill white -draw "circle 300,300 300,0" \) \
  -alpha copy -compose CopyOpacity -composite output.png

Das Ergebnis ist ein PNG mit transparenten Ecken. Verwenden Sie es für das Compositing in Layouts; siehe how to make transparent images.

Methode 2: Kreis auf einem soliden Hintergrund

Für einen fertigen Avatar kompositieren Sie den Kreis auf eine feste Farbe (weiß, eine Markenfarbe oder schwarz). Das ist das, was die meisten „runde Profilbild“-Tools ausgeben.

## Circle on a light-blue background
magick -size 600x600 "xc:#e8f0fe" bg.png
magick bg.png circle.png -gravity center -compose over -composite output.jpg

Wählen Sie eine Hintergrundfarbe, die einen Kontrast zum Motiv bildet. Weiß ist der sichere Standard; eine Markenfarbe passt zu einem Unternehmens-Avatar-Set.

Methode 3: CSS Kreis (keine Bildbearbeitung)

Für eine Webseite müssen Sie das Bild gar nicht cropen – CSS maskiert ein Quadrat in einen Kreis:

.avatar { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; }

border-radius: 50% verwandelt jedes quadratische Element in einen Kreis; object-fit: cover sorgt dafür, dass das Bild es ohne Verzerrung ausfüllt. So rendern die meisten Websites Avatare aus einem quadratischen Quellbild. Die MDN border-radius reference dokumentiert diese Eigenschaft.

Methode 4: Browser-Tool

Für ein einzelnes Bild verwenden Sie den Image Resizer oder ein Circle-Crop-Tool: Hochladen, das Motiv im Quadrat positionieren, den Kreis anwenden und herunterladen. Dies erledigt die „Quadrat-zuerst“-Regel visuell.

Soll man den Kreis selbst erstellen oder der Plattform überlassen?

Bei sozialen Profilbildern sollte man es der Plattform überlassen – laden Sie ein zentriertes Quadrat hoch, und die Plattform maskiert es in einen Kreis. Den Kreis selbst zu erstellen, kann tatsächlich schaden, da einige Plattformen ein Quadrat erwarten und Ihren Kreis in einen kleineren Kreis neu maskieren, was zu weiteren Abschneidungen führt. Erstellen Sie den Kreis nur selbst, wenn Sie ein fertiges rundes Bild für Design, Druck oder einen Avatar benötigen, der nicht erneut maskiert wird.

Dieser Unterschied verwirrt die Leute, weil die Plattformen diese Verwirrung fördern – sie zeigen Ihr Foto in der Benutzeroberfläche als Kreis an, was dazu verleitet, dass Benutzer annehmen müssen, dass sie einen Kreis hochladen müssen. In Wirklichkeit erwartet das Upload-Feld fast immer ein Quadrat; die kreisförmige Anzeige ist eine CSS-Maske, die darüber gelegt wird. Das Hochladen eines bereits eingekreisten Bildes bedeutet, dass die Maske der Plattform Ihr Motiv ein zweites Mal abschneidet und so einen kleineren, engeren Crop erzeugt, als Sie beabsichtigt haben. Der sichere Weg ist es, ein großzügig zentriertes Quadrat mit dem Gesicht des Motivs im mittleren Drittel hochzuladen, damit jeder Kreis, den die Plattform anwendet, immer noch das gesamte Gesicht mit etwas Atemraum enthält.

Häufige Fehler

• Direktes Crop zu einem Kreis. Das Motiv driftet dezentriert ab. Zuerst ein Quadrat.
• Den ganzen Kopf zentrieren, nicht das Gesicht. Ein Kreis schneidet die Ecken; auf Augen/Nase zentrieren.
• Exportieren eines transparenten Kreises als JPEG. JPEG hat kein Alpha; die Ecken werden schwarz oder weiß. Verwenden Sie PNG.
• Ein soziales Profilbild vorab kreisförmig machen. Die Plattform maskiert neu; stattdessen ein zentriertes Quadrat hochladen.
• Kinn oder Stirn abschneiden. Lassen Sie einen Rand im Kreis.

Häufig gestellte Fragen

Wie erstelle ich ein rundes Profilbild?

Cropen Sie auf ein zentriertes Quadrat mit dem zentrierten Gesicht, und lassen Sie es entweder von der Plattform maskieren oder wenden Sie für ein fertiges rundes Bild einen runden Crop an.

Soll ich für soziale Medien zu einem Kreis cropen?

Normalerweise nicht – laden Sie ein zentriertes Quadrat hoch, und die Plattform maskiert es in einen Kreis. Vorab kreisförmig machen kann zu einer erneuten Kürzung führen.

Welches Format ist ein transparenter Kreis?

PNG. JPEG hat keinen Alpha-Kanal, daher können die transparenten Ecken nicht gespeichert werden. Siehe transparent images.

Wie lege ich ein kreisförmiges Foto auf einen Hintergrund?

Erstellen Sie zuerst ein transparentes Circle PNG und kompositieren Sie es dann auf die feste Farbe – oder verwenden Sie CSS border-radius: 50% auf einer Webseite.

Wie croppt man ein Bild zu einem Kreis?

Zuerst auf ein Quadrat cropen (ein Kreis passt nur in eine quadratische Leinwand), dann einen runden Maske anwenden. Exportieren Sie als PNG, um die Ecken transparent zu halten, oder platzieren Sie den Kreis auf einem soliden Hintergrund und exportieren Sie als JPG. Die „Quadrat-zuerst“-Regel ist nicht verhandelbar – ein Kreis in einer nicht quadratischen Leinwand hinterlässt unschöne Ecken.

Warum muss ich zuerst auf ein Quadrat cropen?

Weil sich ein Kreis in eine quadratische Leinwand einfügt. Das Anwenden einer runden Maske auf ein nicht quadratisches Bild lässt Ecken zurück, die nicht transparent sind und whatever die Form der Leinwand ist, enthalten. Zuerst auf ein Quadrat zu cropen, mit dem zentrierten Motiv, bedeutet, dass der Kreis sauber eingeschrieben wird und das Ergebnis ein rundes Bild ohne lose Ecken ist.

Wie groß sollte ein Profilbild sein?

Ungefähr 400×400 bis 800×800 Pixel – groß genug, um scharf zu bleiben, klein genug, um schnell zu laden. Zuerst auf ein Quadrat cropen, dann den Kreis anwenden. Die meisten Plattformen reduzieren größere Uploads, daher ist 800px eine sichere Obergrenze. Siehe image cropper.

Kann ich ein nicht quadratisches Bild zu einem Kreis cropen?

Nur, indem man zuerst auf ein Quadrat croppt – ein Kreis passt in eine quadratische Leinwand, daher lässt ein nicht quadratisches Bild unschöne Ecken zurück. Cropen Sie immer zuerst auf ein Quadrat mit dem zentrierten Motiv und wenden Sie dann den Kreis an. Die „Quadrat-zuerst“-Regel ist für einen sauberen Circle Crop nicht verhandelbar.

Wie halte ich einen Circle Crop scharf?

Exportieren Sie in 2x der Anzeigegröße (z. B. 800px bei einer 400px Anzeige), damit der Kreis auf Retina-Bildschirmen knackig bleibt, und verwenden Sie PNG, um die transparenten Ecken verlustfrei zu erhalten. Ein 1x Kreis auf einem High-DPI-Bildschirm sieht weich aus. Die transparenten Kanten profitieren besonders von PNG gegenüber JPEG, da JPEG kein Alpha-Kanal hat.

Wo werden Circle Crops verwendet?

Profilbilder und Avatare auf fast jeder Plattform – sozial, E-Mail, App, Forum. Sie sind der Standard für eine Benutzeridentität, weshalb ein quadratisches Quellbild, das auf dem Motiv zentriert ist, sauber in einen Kreis croppt wird. Passen Sie die Exportgröße an die Spezifikation des Avatars der Plattform an, normalerweise 400–800px.

Bildquellen

• Circle-crop Demo, Square-then-Circle Rule und Use-Cases für Circle Crops – erstellt vom Autor anhand eines E-Commerce-Fotos (Pexels #16675632, Foto von Mikael Blomkvist), um das tatsächliche Circle-Crop-Ergebnis und die „Quadrat-zuerst“-Regel zu zeigen.