Website-Bilder
Bildgröße ändern, ohne das Bild zu verzerren
Ändere die Bildgröße ohne Verzerrung: Seitenverhältnis sperren, ein Maß ändern und bei einer anderen Form zuschneiden oder Ränder ergänzen.
Verkleinern, zuschneiden oder Ränder ergänzen?
Breitere Gesichter entstehen meist durch ein falsches Seitenverhältnis. Höhere Exportqualität behebt das nicht.
Skalieren ändert die Pixelzahl und erhält bei proportionalen Maßen Inhalt und Form. Zuschneiden entfernt Inhalt und ändert Ausschnitt oder Seitenverhältnis. Ränder betten das ganze Bild in eine größere Fläche mit Farbe oder Transparenz ein.
Entscheide nach dem Inhalt: Etwas Himmel lässt sich vielleicht entfernen, ein Produkt sollte vollständig sichtbar bleiben. Schneide keine wichtige Anweisung ab, nur um ein Quadrat zu erhalten.

Proportional mit Pixilo skalieren
- Originalmaße prüfen. Nutze Dateieigenschaften oder Bildeditor und eine Quelle in voller Auflösung.
- Zielgröße bestimmen. Beachte Vorgaben und Anzeigefläche. Vergrößere keine kleine Quelle nur für eine beliebige Zahl.
- Bildgröße ändern. Lass die Sperre für das Seitenverhältnis eingeschaltet und gib die gewünschte Breite oder Höhe ein. Das Werkzeug berechnet die andere Abmessung automatisch.
- Kopie bearbeiten und herunterladen. Prüfe Maße und Darstellung in der tatsächlichen Anzeigegröße.
Die Sperre ist standardmäßig aktiv. Bei 2400 × 1600 Pixeln berechnet eine Breite von 1200 die Höhe 800. Ohne Sperre sind die Werte unabhängig; ein leeres Feld behält sein Originalmaß und kann das Bild verzerren. Prüfe beide Werte vor der Verarbeitung.
Unterstützte JPG-, PNG- und WebP-Bilder werden neu gezeichnet und im Eingabeformat exportiert. JPEG und WebP können dabei Details verlieren. Bewahre das Original für spätere Versionen auf.

Passende Maße berechnen
2400 × 1600 entspricht 3:2. Bei 1200 Pixeln Breite beträgt die passende Höhe 800.
Neue Höhe = ursprüngliche Höhe × neue Breite ÷ ursprüngliche Breite. Umgekehrt gilt neue Breite = ursprüngliche Breite × neue Höhe ÷ ursprüngliche Höhe. Runde auf ganze Pixel.
| Original | Neue Breite | Passende Höhe |
|---|---|---|
| 2400 × 1600 | 1200 | 800 |
| 1600 × 900 | 800 | 450 |
| 1200 × 1800 | 600 | 900 |
| 2000 × 2000 | 1000 | 1000 |
Halbierte Maße ergeben ein Viertel der Pixel. Die Dateigröße hängt zusätzlich von Format, Inhalt und Kompression ab.
Aus einem Querformat ein Quadrat machen
1600 × 900 wird proportional zu 800 × 450. Für 800 × 800 fehlen 350 Pixel Höhe.
Das Quadrat durch Zuschnitt füllen
Wähle im Zuschnittwerkzeug einen quadratischen Ausschnitt mit dem wichtigen Motiv. Ein Ausschnitt von 900 × 900 lässt sich auf 800 × 800 skalieren. Seitliche Inhalte entfallen; Verzerrung entsteht nicht. Die Bildmitte ist nicht immer der beste Ausschnitt.
Das ganze Foto mit Rändern behalten
Platziere 800 × 450 auf einer Fläche von 800 × 800 in einem geeigneten Editor. Zentriert bleiben oben und unten je 175 Pixel. Verwende passende Farbe oder Transparenz. Pixilos Größenwerkzeug fügt keine Ränder automatisch hinzu.
Auf Websites schneidet object-fit: cover zur Flächenfüllung zu, während object-fit: contain das ganze Bild zeigt. Die MDN-Referenz zu object-fit erklärt den Unterschied. CSS ändert die Darstellung, nicht die Dateigröße.
Warum wirkt ein korrekt skaliertes Bild unscharf?
Richtige Proportionen garantieren keine Schärfe. Vergrößerung schätzt zusätzliche Pixel, stellt fehlende Details aber nicht zuverlässig wieder her.
Verkleinerung kann kleine Schrift und dünne Linien unleserlich machen. Prüfe die tatsächliche Anzeigegröße und versuche mehr Pixel, einen engeren Ausschnitt oder weniger Kompression.
Hochauflösende Displays können mehr Bildpixel als CSS-Pixel benötigen. Vergrößere dennoch keine schwache Quelle nur für „2ד. Der Leitfaden zu Website-Bildgrößen hilft bei der Auswahl.
Innerhalb von Höchstmaßen bleiben
Für maximal 1200 × 800 berechnest du den kleineren Wert aus maximale Breite ÷ ursprüngliche Breite und maximale Höhe ÷ ursprüngliche Höhe. Multipliziere beide Maße mit diesem Faktor.
3000 × 2000 passt als 1200 × 800. Ein Hochformat mit 2000 × 3000 braucht etwa 533 × 800, denn 800 ÷ 3000 begrenzt den Faktor. 1200 × 800 würde es verzerren. Ein bereits passendes Bild muss nicht vergrößert werden.
Runde auf ganze Pixel und prüfe beide Grenzen. Ein Pixel Abweichung ist oft Rundung; 3:2 zu 3:4 ist eine Formänderung und braucht Zuschnitt oder Ränder.
„Maximal 1200 × 800“ erlaubt ein schmaleres Hochformat. „Genau 1200 × 800“ kann Zuschnitt oder Ränder verlangen. Prüfe auch Mindestmaße: Eine kleine Quelle erreicht sie möglicherweise nur mit schlechterer Schärfe.
Motiv und Bildränder kontrollieren
Vergleiche Original und Kopie unter gleichen Bedingungen. Kreise bleiben rund, Gesichter natürlich und Linien unverzerrt. Prüfe beim Zuschnitt jede Kante auf abgeschnittene Hände, Produkte, Beschriftungen oder Logos.
Kontrolliere den tatsächlichen Zielort: Website oder Profilansicht können erneut zuschneiden. Nutze Positionseinstellungen und halte Wichtiges von den Rändern fern.
Große transparente Ränder können Logos unerwartet klein wirken lassen. Entferne sie bei Bedarf, aber beachte den vorgeschriebenen Schutzraum. Teste kleine Screenshot-Beschriftungen in der Endgröße.
Häufige Fragen
Kann ich das Seitenverhältnis ohne Zuschnitt ändern?
Mit Rändern bleibt alles erhalten. Ohne Ränder erfordert eine andere Form Zuschnitt, Verzerrung oder neue Inhalte.
Warum ist das Bild nur auf der Website verzerrt?
Die Seite kann unpassende Maße vorgeben. Prüfe die Darstellung, bevor du das Original änderst. Eine proportionale Höhe ist meist besser.
Ist Skalieren dasselbe wie Komprimieren?
Nein. Skalieren ändert Pixelmaße, Kompression die Speicherung. Beides kann Dateien verkleinern.
Erst zuschneiden oder erst verkleinern?
Meist zuerst das Original zuschneiden und den gewählten Ausschnitt einmal verkleinern. So bleiben mehr Details verfügbar.
Wähle die Form vor dem Export
Behalte die Proportionen für das vollständige Bild bei. Schneide zuerst zu, wenn eine andere Form nötig ist.
Bildgröße ändernBild zuschneiden →