Zum Inhalt springen
AI Sprite Maker

Spritesheet-Slicer

Zerleg jedes Spritesheet in Frames. Das Raster wird für dich erkannt, und das Ergebnis läuft sofort ab und lässt sich direkt exportieren.

  • Kostenlos
  • Läuft lokal
  • Ohne Anmeldung
Spritesheet hier ablegen
PNG mit Transparenz oder einfarbigem Hintergrund. Das Raster wird automatisch erkannt, feinjustieren kannst du danach.
Datei wählen
Läuft in deinem Browser · nichts wird hochgeladen

Alles läuft in deinem Browser. Deine Dateien werden nie hochgeladen, daher funktioniert es nach dem Laden der Seite auch offline.

Von Hand zerlegen heißt: Zellengrößen raten, Ränder abzählen und um einen Pixel versetzte Schnitte korrigieren. Der Slicer liest das Sheet zuerst: Er findet ein gleichmäßiges Raster, dessen Schnittlinien keine Sprite-Pixel kreuzen, oder erkennt jeden einzelnen Sprite an seinen zusammenhängenden Pixeln, wenn das Sheet kein Raster hat. Du siehst die Schnitte über dem Sheet, die Animation läuft beim Anpassen mit, und jede Zelle kannst du per Klick verwerfen.

Anleitung: Spritesheet-Slicer

  1. Zieh ein Sheet mit transparentem oder einfarbigem Hintergrund hierher. Das Raster wird sofort erkannt und darübergelegt.
  2. Stimmt die Schätzung nicht, leg Zeilen und Spalten fest oder wechsle zu Zellengröße und gib die Frame-Größe ein. Nutze Versatz und Abstand für Sheets mit Rand oder Lücken zwischen den Frames.
  3. Für gepackte Sheets ohne Raster (Item-Sets, Tilesets mit Props) wähl Sprites finden. Der Zusammenführ-Abstand ordnet abgetrennte Teile wie eine Schwertspitze ihrem Sprite zu.
  4. Klick auf Zellen im Sheet, um sie auszuschließen. Leere Zellen werden automatisch übersprungen.
  5. Schau dir die Vorschau an, stell die FPS ein und lade die Frames als ZIP, als GIF oder als neu aufgebautes Sheet mit Daten für Godot, Unity, Phaser oder Aseprite herunter.

Was du bekommst

  • Frames-ZIP: jeder Frame als eigenes PNG (in den Raster-Modi die Zelle, im Modus Sprites finden ein enger Rahmen), dazu ein JSON mit der Position jedes Frames im Original-Sheet.
  • Einheitliche Frames: alle Frames in gleich großen Zellen, unten mittig ausgerichtet, bereit zum Animieren.
  • Neu aufgebautes Sheet mit sauberen Abständen, dazu Daten für Aseprite, Phaser/TexturePacker, Godot 4 und CSS sowie ein GIF.

Zu welchen Engines es passt

  • Die Ausrichtung unten mittig hält die Füße in jedem Frame auf derselben Linie, genau das brauchen Platformer- und Top-down-Figuren.
  • Die Datendateien des neu aufgebauten Sheets laden direkt in Godot 4 (SpriteFrames), Phaser 3 (Atlas) und Aseprite-basierten Importern für Unity und Godot.

Tipps aus der Spieleentwicklung damit

  • Sheets aus Asset-Stores haben oft 1 px Abstand zwischen den Frames. Stell Abstand X/Y auf 1, wenn die Schnittlinien um einen Pixel daneben liegen.
  • Zerlegt Sprites finden eine Figur in Einzelteile, erhöh den Zusammenführ-Abstand, bis jede Figur ein Rahmen ist.
  • Verschmilzt es zwei benachbarte Sprites, senk den Zusammenführ-Abstand auf 0.
  • Sheets mit deckendem Hintergrund: Aktivier Hintergrundfarbe entfernen, damit die Frames transparent herauskommen.

Anwendungsfälle

  • Einzelne Frames aus einem Asset-Store-Sheet holen, um eine Pose zu bearbeiten.
  • Ein Icon- oder Item-Sheet für UI oder Inventar in einzelne PNGs aufteilen.
  • Die Abstände eines Sheets neu setzen, damit es mit dem Grid-Slicer einer Engine funktioniert.
  • Aus einem Sheet ein GIF machen, um den Fortschritt zu zeigen.

FAQ

Wie funktioniert die automatische Rastererkennung?
Sie probiert jede Spalten- und Zeilenzahl, die das Sheet gleichmäßig teilt, verwirft jedes Raster, dessen Schnittlinien durch Sprite-Pixel gehen oder einen Sprite zerteilen, und verlangt, dass die meisten Zellen etwas enthalten. Das feinste Raster, das besteht, gewinnt. Passt kein gleichmäßiges Raster, etwa bei einem Atlas oder UI-Kit, wechselt sie zu Sprites finden.
Was, wenn meine Sprites nicht in einem Raster liegen?
Nimm Sprites finden. Es markiert jede Gruppe zusammenhängender Pixel, führt Gruppen innerhalb des Zusammenführ-Abstands zusammen, verwirft Fitzel unter der Mindestgröße und sortiert die Ergebnisse in Leserichtung (Zeilen von oben nach unten, von links nach rechts).
Kann es Sheets mit einfarbigem Hintergrund zerlegen?
Ja. Die Hintergrundfarbe wird am Rand erkannt und bei der Erkennung als leer behandelt. Aktivier Hintergrundfarbe entfernen, damit die exportierten Frames transparent sind.
Werden meine Dateien hochgeladen?
Nein. Zerlegen, Erkennung und Kodierung laufen komplett in deinem Browser. Das Sheet verlässt dein Gerät nie.
Welche Dateinamen bekommen die Frames?
Den Namen des Sheets plus einen Index mit führenden Nullen, zum Beispiel hero_00.png, hero_01.png, damit sie überall richtig sortiert werden.
Kann ich die Frames anders wieder zusammensetzen?
Ja, das Export-Panel baut ein Sheet mit der Spaltenzahl und dem Padding deiner Wahl neu auf. Für enges Packing, Extrusion und Zweierpotenz-Größen nimm den Spritesheet-Maker.
Alle kostenlosen Tools →