ImgConvert

GIF in ein Sprite Sheet umwandeln

Fasse die vollständigen Bilder eines GIFs in einer PNG zusammen. Wähle Raster oder Bildstreifen, Abstand und Skalierung und lade das fertige Bild herunter.

Wähle ein GIF bis 25 MB. Der Upload beginnt bei der Auswahl.

0 px
100%

GIF in ein Sprite Sheet umwandeln und als PNG speichern

Mit diesem GIF-Konverter für Sprite Sheets ordnest du die vollständigen Bilder einer Animation in einer PNG-Datei an. Wähle ein Raster, eine waagerechte Reihe oder eine senkrechte Spalte und passe Abstand und Skalierung an. Das Ergebnis ist ein statisches Bild, das du in deinem eigenen Projekt in Einzelbilder aufteilen kannst.

Um ein Sprite Sheet aus einem GIF zu erstellen, brauchst du eine gespeicherte GIF-Datei mit der gewünschten Bewegung. Ein Sprite Sheet, auch Spritesheet geschrieben, fasst die Bilder in gleich großen Zellen zusammen. Die ursprüngliche Reihenfolge bleibt erhalten, einschließlich mehrfach gespeicherter identischer Bilder.

Ein Sprite Sheet erstellen: vom GIF zur PNG-Datei

1

Eine GIF-Datei auswählen und hochladen

Wähle ein gespeichertes GIF mit höchstens 25 MB aus. Der Upload beginnt direkt bei der Auswahl. Warte, bis er abgeschlossen ist, bevor du das Sprite Sheet erstellst.

2

Anordnung und Größe der Einzelbilder festlegen

Wähle Raster, waagerechte Reihe oder senkrechte Spalte. Beim Raster kannst du die Spalten automatisch bestimmen lassen oder selbst festlegen. Mit den Schiebereglern stellst du Abstand und Skalierung ein.

3

PNG erstellen, Vorschau prüfen und herunterladen

Klicke auf „Sprite Sheet erstellen“, um die Umwandlung auf unserem Server zu starten. Prüfe danach die Vorschau und lade die PNG-Datei herunter. Du kannst die Einstellungen ändern und das bereits hochgeladene GIF erneut verarbeiten.

Raster, waagerechter oder senkrechter Bildstreifen?

Die Anordnung bestimmt das Seitenverhältnis der PNG-Datei. Wähle sie danach aus, wie du die Einzelbilder später ausschneidest und welche Texturgrößen dein Projekt verarbeiten kann.

AnordnungGeeignet fürDarauf solltest du achten
RasterMehrere Bildreihen innerhalb einer Datei.Automatische Spaltenzahl oder eine eigene Vorgabe von 1 bis 240 Spalten.
Waagerechte ReiheEinen horizontalen Bildstreifen, auch Sprite Strip genannt.Viele Einzelbilder können eine sehr breite PNG-Datei ergeben.
Senkrechte SpalteEinen vertikalen Streifen mit allen Einzelbildern.Prüfe die zulässige Bildhöhe in der Anwendung, die das Ergebnis importiert.

Im Raster verläuft die Reihenfolge von links nach rechts und anschließend von oben nach unten. Jede Anordnung behält dieselbe Bildfolge bei; ein anderes Layout entfernt keine Frames.

Das Sprite Sheet an dein Projekt anpassen

Spalten automatisch bestimmen oder selbst festlegen

Die automatische Anordnung berücksichtigt die Anzahl und Abmessungen der Frames. Lege die Spalten selbst fest, wenn dein Projekt eine bestimmte Anzahl von Bildern pro Zeile benötigt.

Ein Beispiel: Acht Frames mit jeweils 64 × 64 Pixeln ergeben bei drei Spalten, 2 px Abstand und 100% Skalierung eine PNG mit 196 × 196 Pixeln. Eine Zelle bleibt leer und transparent.

Abstand zwischen den Einzelbildern

Der Abstand lässt sich von 0 bis 32 Pixel einstellen. Voreingestellt ist 0; die Zellen liegen dann ohne Lücke nebeneinander. Höhere Werte erzeugen transparente Zwischenräume.

Am äußeren Bildrand wird kein zusätzlicher Abstand angefügt. Gib beim späteren Ausschneiden denselben Zwischenraum an, damit die Auswahl nicht in das Nachbarbild hineinragt.

Frames von 50% bis 200% skalieren

Der Skalierungsregler verändert Breite und Höhe jedes Einzelbilds. Du kannst ganze Prozentwerte von 50% bis 200% wählen. Bei 100% bleiben die ursprünglichen Abmessungen erhalten.

Die Größenänderung verwendet das Nächste-Nachbar-Verfahren. Es erhält harte Pixelkanten, statt sie weichzuzeichnen. Beim Verkleinern können dennoch Details entfallen; Vergrößern ergänzt keine Informationen, die im GIF fehlen.

Was verändert sich beim Umwandeln eines GIFs in ein Sprite Sheet?

Ein GIF kann zwischen zwei Frames nur die veränderten Bildbereiche speichern. Der Konverter setzt zuerst die vollständigen Bilder zusammen und ordnet sie dann in gleich großen Zellen an. Bereits transparente Pixel bleiben transparent; ein deckender Hintergrund bleibt Bestandteil des Bildes.

Jeder gespeicherte Frame erscheint genau einmal, auch wenn mehrere Bilder identisch sind. Die PNG-Datei enthält weder eine abspielbare Animation noch Daten zur Anzeigedauer der Frames. Entferne unerwünschte Ränder bei Bedarf zuerst mit GIF zuschneiden und verwende anschließend die bearbeitete Animation.

Das Sprite Sheet für deine Animation weiterverwenden

Dieser Sprite-Sheet-Generator verwendet eine GIF-Datei als Ausgangsmaterial. Importiere das PNG in deinen Editor oder deine Game Engine und stelle dort Zellgröße und Abstand ein. Beachte die Texturgrenzen des Zielprojekts. Das Tool exportiert keine enginespezifische Projekt- oder Atlasdatei.

Für einen CSS-Workflow mit background-image findest du weitere Hinweise im MDN-Leitfaden zu Bild-Sprites. Benötigst du stattdessen eine Datei, die direkt in einem Videoplayer läuft, nutze GIF in Video umwandeln.

Grenzen für GIF-Datei und Sprite-Sheet-Größe

PrüfungGrenze
EingabedateiEine GIF-Datei mit höchstens 25 MB
Gespeicherte FramesHöchstens 240
Gesamtpixelzahl der AusgangsbilderHöchstens 60 Millionen: Breite × Höhe × Frameanzahl
PNG-AbmessungenHöchstens 8192 Pixel pro Seite
Pixelzahl der PNG-DateiHöchstens 60 Millionen: Ausgabebreite × Ausgabehöhe

Alle Grenzen gelten gleichzeitig. Auch eine kleine GIF-Datei kann nach dem Dekodieren viele Pixel enthalten. Überschreitet die Ausgabe eine Grenze, versuche ein Raster, eine andere Spaltenzahl oder eine kleinere Skalierung.

Fragen zu Sprite Sheets aus GIFs

Ja. Du kannst jeweils eine GIF-Datei ohne Konto umwandeln. Das Tool fügt der PNG kein Wasserzeichen hinzu. Ein Wasserzeichen, das bereits in der ursprünglichen Animation sichtbar ist, bleibt Teil des Bildinhalts.

Die PNG ist ein statisches Bild mit den einzelnen Frames. Sie enthält weder die Anzeigedauer der einzelnen Frames noch die Wiederholungseinstellung des GIFs. Lege das Timing in deiner eigenen Software fest, nachdem du die Bilder ausgeschnitten hast.

Vorhandene Transparenz bleibt erhalten; auch Zwischenräume und ungenutzte Zellen sind transparent. Ein deckender Hintergrund wird bei dieser Umwandlung nicht entfernt. Prüfe die Bildkanten in der Vorschau, besonders wenn du die Animation auf einem anderen Hintergrund verwenden möchtest.

Ein Raster besteht aus vollständigen Reihen gleich großer Zellen. Reicht die Frameanzahl nicht für die letzte Reihe, bleiben die übrigen Positionen transparent. Es sind Leerflächen und keine zusätzlichen Frames für die Wiedergabe.

Der Konverter behält jeden im GIF gespeicherten Frame und entfernt keine Duplikate. Wiederholte Bilder können bereits in der Quelldatei enthalten sein. Die Anzahl der gefüllten Zellen richtet sich nach den gespeicherten Frames.

Diese Seite fasst alle Frames in einer PNG zusammen. Für eine nummerierte Bildfolge als ZIP verwende GIF-Frames extrahieren. Damit kannst du jedes Bild separat weiterbearbeiten.

Du kannst es als Ausgangsbild verwenden, wenn dein Arbeitsablauf das Ausschneiden eines regelmäßigen Rasters unterstützt. Zellgröße, Abstand und Wiedergabe richtest du selbst ein. Der Download enthält nur die PNG-Datei; prüfe deshalb die Importvorgaben deiner Engine oder deines Codes.

GIF und PNG kodieren die Bilddaten unterschiedlich. Außerdem enthält die Ausgabe sämtliche vollständigen Frames auf einer gemeinsamen Bildfläche. Transparente Lücken und leere Zellen vergrößern ebenfalls die Abmessungen. Eine niedrigere Skalierung verkleinert das Bild, garantiert aber keine kleinere Datei.

Aus deinem GIF ein Sprite Sheet erstellen

Wähle eine GIF-Datei aus, ordne ihre vollständigen Frames an und lade eine PNG für dein Projekt herunter.