Bild / Fotowerkstatt

Vorher-nachher-Schieberegler

Erstelle einen Vorher-nachher-Vergleich mit bearbeitbaren Beschriftungen und einem Live-Schieberegler. Lade eine portable HTML-Datei mit beiden Bildern, eine animierte GIF-Wischanimation oder – sofern unterstützt – eine WebM-Datei herunter.

Vorher-nachher-Schieberegler: Verwendet die Proportionen des Vorher-Bildes und schneidet das Nachher-Bild mittig zu, damit es hineinpasst. Der HTML-Download enthält beide PNG-Bilder als Daten-URIs sowie einen eigenen, per Tastatur bedienbaren Bereichs-Schieberegler. GIF-Wischanimationen passen in 480 × 480 Pixel; WebM-Wischanimationen werden dort, wo die Browseraufzeichnung verfügbar ist, etwa zwei Sekunden lang aufgezeichnet. Läuft zu 100% lokal in deinem Browser, ohne Datei-Uploads zum Server.

Kategorie
Bildwerkzeuge
Ausführungen
In deinem Browser
Kosten
Kostenlos · ohne Anmeldung
Verfügbarkeit
Einsatzbereit
Vorher-Nachher-SchiebereglerLokale Verarbeitung

Läuft vollständig in deinem Browser

Gilt für den nächsten Rasterexport.
Vorher-Foto auswählen

Klicken, ziehen und ablegen oder einfügen · bleibt auf diesem Gerät

Nachher-Foto auswählen

Klicken, ziehen und ablegen oder einfügen · bleibt auf diesem Gerät

Das Vorher-Foto legt die Proportionen fest; das Nachher-Foto wird zum Einpassen mittig zugeschnitten. Einzelbilder und HTML-Bilder werden in 1200 × 1200 Pixel eingepasst. GIF-Wischblenden werden in 480 × 480 Pixel eingepasst.

HTML-Exporte enthalten die Bilder und den Schieberegler-Code in einer Datei. Öffne die Datei in einem Browser, um den Regler zu bewegen oder die Pfeiltasten zu verwenden.

Live-Vergleich

Wähle beide Fotos aus, um sie zu vergleichen.

Die WebM-Aufzeichnung ist in diesem Browser nicht verfügbar. Lade stattdessen den GIF-Übergang herunter.

Mobiler Vergleich

Beide Bilder werden auf dieselben Proportionen normalisiert und als PNG-Daten-URIs in das HTML eingebettet. Ein natives Bereichseingabefeld steuert den sichtbaren Bereich des Nachher-Bildes und unterstützt die Pfeiltasten. Die Datei enthält Inline-JavaScript, das durch restriktive Hosting-Richtlinien blockiert werden kann.

Animierte Exporte

Die Verfügbarkeit von WebM wird vor der Aufnahme geprüft. GIF dient als Ersatz, wenn WebM oder die Canvas-Aufnahme nicht verfügbar ist. Prüfung der MediaRecorder-Unterstützung: https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/isTypeSupported_static

So benutzt du es

  1. Wähle das Vorher- und das Nachher-Foto aus.
  2. Füge Beschriftungen hinzu und bewege den Vergleichs-Schieberegler.
  3. Lade HTML für einen interaktiven Schieberegler oder GIF beziehungsweise unterstütztes WebM für eine animierte Wischanimation herunter.

Datenschutz & Einschränkungen

Deine Eingaben und Bilder bleiben in deinem Browser. Nichts wird hochgeladen.

Ähnliche Tools

BildvergleichSofortbildrahmenBildgröße ändern

Häufige Fragen

Funktioniert die HTML-Datei offline?

Ja. Sie enthält beide Bilder und den Code für den Schieberegler in einer Datei und stellt keine externen Anfragen.

Warum ist WebM deaktiviert?

Der Browser muss WebM-Aufzeichnungen und die Aufzeichnung von Canvas-Inhalten unterstützen. Wenn diese Funktionen nicht verfügbar sind, kannst du die GIF-Wischanimation verwenden.

Worin unterscheidet sich dieses Tool vom Bildvergleichs-Schieberegler?

Diese Seite exportiert einen funktionierenden HTML-Schieberegler und animierte Wischanimationen. Der Bildvergleichs-Schieberegler exportiert ein statisches PNG, auch mit Anordnungen nebeneinander.

Kostenloses Tool · läuft in deinem browser · kein Konto nötig