Hoppa till innehållet
Gratis verktyg

Dela upp Sprite Sheet i enskilda bildrutor med Sprite Sheet Cutter

Sprite Sheet Cutter delar upp din PNG-, JPG- eller GIF-fil i enskilda bildrutor utifrån kolumner och rader eller sprite-storlek. Ett ark på 274 × 138 px med 8 kolumner och 4 rader blir till exempel 32 PNG-filer på 32 × 32 px vardera. Gratis, utan registrering eller uppladdning: din bild behandlas bara i webbläsaren.

Byggd av Justin Schuessler

Sprites klara? Testa din Mod på din egen Minecraft-server.

Dra ett Sprite Sheet hit eller välj ett

PNG, JPG eller GIF, även stora bildark som 8192 × 8192 px, upp till 10 000 bildrutor per rutnät. Du kan också klistra in med Ctrl+V.

Din bild stannar i din webbläsare: Den varken laddas upp eller sparas.

Inget sprite sheet har laddats än

Förhandsvisningen av animationen visas så snart rutnätet är giltigt.

Ladda ner

Varje frame sparas som PNG, utan kvalitetsförlust och med transparens, även om originalet är en JPG.

Rutnät

Ladda in ett Sprite Sheet så identifieras rutnätet automatiskt.

Exempelresultat

Så delar Sprite Sheet Cutter upp ett Sheet

Verktyget identifierar kolumner, rader, offset och spacing utifrån de genomskinliga mellanrummen eller använder dina värden. Det visar rutnätet direkt och sparar varje bildruta som PNG. Exemplet är det sheet som finns bakom knappen ”Ladda exempelblad”; dina värden beror på din bild.

Exempel · Indata: 274 × 138 px, 8 kolumner, 4 rader, offset 2 px, mellanrum 2 px

Bildrutor
32
Bildrutestorlek
32 × 32px
Rutnät
8 × 4
Kolumner × rader
Outnyttjat utrymme
2 / 2px
höger / nedåt

Utdata

beispiel-sprite-sheet-frames.zip
sprite_00.png   x   2  y   2  32 × 32sprite_01.png   x  36  y   2  32 × 32sprite_02.png   x  70  y   2  32 × 32sprite_08.png   x   2  y  36  32 × 32…sprite_31.png   x 240  y 104  32 × 32
  • sprite_{index}Filnamnsmönster: löpnummer utfyllt med nollor till två siffror
  • x / yFramens position i sheetet: offset plus föregående frames och spacing

Varför detta verktyg

En Sprite Sheet Splitter som visar rutnätet

Skapat för moddare, indieutvecklare och alla som förbereder spelgrafik för sin egen server.

Rutnät identifierat och visas direkt ovanpå bilden

Verktyget hittar själv kolumner, rader, marginaler och avstånd utifrån de genomskinliga mellanrummen. Varje ändring flyttar rutnätet direkt, så du ser före exporten om varje bildruta fångas upp korrekt.

Välj specifika bildrutor

Ett klick markerar eller avmarkerar en bildruta, Skift+klick ett helt intervall. Exportera bara gångcykeln i stället för hela arket, som enskilda PNG-filer eller samlat som ZIP.

Granska animationen före nedladdning

De valda bildrutorna spelas upp i en loop med justerbar hastighet från 1 till 60 FPS. En felaktig offset märks då direkt som hackningar.

Dela upp GIF i bildrutor

Enskilda animeringsrutor extraheras ur en animerad GIF och sätts ihop korrekt. Många GIF-filer lagrar bara ändrade områden, men här får du ändå varje ruta i sin helhet.

Pixelprecist som PNG

Bildrutor kopieras utan utjämning och sparas förlustfritt som PNG. Genomskinlighet bevaras och pixelkonst förblir skarp vid inzoomning.

Utan uppladdning, även för stora sheets

Bilden behandlas bara i din webbläsare, inget skickas till en server. Även spritesheets på 8192 × 8192 pixlar går att zooma smidigt eftersom bara den synliga delen ritas upp.

Så fungerar det

Så delar du upp ett spriteark i fyra steg

Från sprite sheet till ZIP utan konto eller uppladdning.

Steg 1

Ladda Sprite Sheet

Dra en PNG-, JPG- eller GIF-fil till fältet, välj den eller klistra in den med Ctrl+V. För PNG- och GIF-filer med genomskinlighet identifierar verktyget rutnätet utifrån mellanrummen mellan sprites, inklusive marginaler, avstånd och ritade skiljelinjer.

Steg 2

Kontrollera rutnätet och justera vid behov

Rutnätet visas direkt ovanpå bilden. Om det inte passar anger du kolumner och rader eller sprite-storlek samt förskjutning och avstånd under ”Justera rutnät”. För JPG-filer ställer du alltid in rutnätet själv.

Steg 3

Testa animationen

Animationsförhandsvisningen spelar upp bildrutorna i en loop med 1 till 60 bilder per sekund. Med pilarna går du igenom dem bildruta för bildruta. Om animationen hackar är förskjutningen eller avståndet oftast inte rätt inställt än.

Steg 4

Välj och ladda ner bildrutor

Välj enskilda bildrutor med ett klick, ett område med Shift+klick eller alla bildrutor. Ange filnamnsmönstret med {index}, {row} och {col} och ladda ner bildrutorna som PNG-filer eller samlade i en ZIP-fil.

Guide

Ställ in rutnät: kolumner, rader, sprite-storlek, offset och spacing

Två sätt leder till samma rutnät. Välj det där du känner till värdena. Verktyget beräknar och visar resten.

Kolumner och rader
Antal bildrutor i bredd och höjd. Verktyget beräknar storleken på varje sprite utifrån det.
Sprite-bredd och -höjd
Storleken på en bildruta i pixlar, om du känner till den, till exempel 16, 32 eller 64 px. Verktyget räknar ut antalet kolumner och rader utifrån den.
Offset X och Y
Marginalen upptill och till vänster före den första bildrutan. Många spritesheets har 1 eller 2 pixlar här.
Avstånd X och Y
Avståndet mellan två bildrutor. Det räknas bara mellan bildrutorna, inte efter den sista.

Så räknar verktyget

Sprite-bredd = (bildbredd − förskjutning − avstånd × (kolumner − 1)) ÷ kolumner

Exempel: Ett ark med bredden 274 px, offset 2 px, spacing 2 px och 8 kolumner ger (274 − 2 − 2 × 7) ÷ 8 = 32,25, avrundat nedåt till 32 px per frame. 2 px blir över vid högerkanten.

Om en inställning inte passar bilden, till exempel fler kolumner än pixlar eller ett Offset som är större än bilden, visar verktyget varför i stället för att exportera felaktiga frames utan förvarning. Ett rutnät kan ha högst 10 000 frames.

Hitta rutnät

Automatiskt, manuellt eller inom ett område: så hittar verktyget rutnätet

Vilken metod som passar beror på ditt ark. Alla tre ger samma jämna rutnät.

Identifiera automatiskt

I PNG- och GIF-filer med genomskinlighet letar verktyget efter genomskinliga mellanrum mellan sprites och enfärgade skiljelinjer. Utifrån dem beräknar det kolumner, rader, förskjutning och avstånd för bilder upp till 8192 × 8192 pixlar.

Ställ in manuellt

För JPG-filer, bilder större än 8192 × 8192 pixlar eller när identifieringen blir fel anger du kolumner och rader eller sprite-storlek samt förskjutning och avstånd. Om ett värde inte passar bilden talar verktyget om varför.

Dra område

På ett masterark med block av olika cellstorlek drar du en rektangel runt ett block. Verktyget identifierar då rutnätet bara i det området, och kanterna fäster vid mellanrummen mellan sprites.

Packade texturatlaser där bildrutor av olika storlek ligger utspridda kan inte delas upp med ett rutnät. Deras koordinater finns i packprogrammets atlasfil, som det här verktyget inte kan läsa.

GIF-delare

Dela upp GIF i enskilda bildrutor

En animerad GIF är inte ett rutnät, utan en följd av bilder. Därför finns ett särskilt läge.

Första bilden som sprite sheet

Om din GIF egentligen är ett Sprite Sheet stänger du av ”Exportera GIF-frames”. Då använder verktyget den första bilden som en PNG och identifierar rutnätet.

Exportera GIF-bildrutor

En animerad GIF öppnar verktyget direkt i det läget och delar upp animationen i enskilda bilder, upp till 200 bildrutor. Verktyget hämtar förhandsvisningens hastighet från GIF-filen.

Hela bildrutor i stället för fragment

GIF-filer sparar ofta bara området som förändras och anger vad som ska hända med föregående bild. Verktyget sätter ihop varje bildruta enligt dessa regler, så att bilderna inte blir ofullständiga eller utsmetade.

Upptäck mer

Fler verktyg

FAQ

Vanliga frågor

Korta svar om Sprite Sheets, GIF-frames och denna Sprite Sheet Cutter.

En Sprite Sheet Cutter, även kallad Sprite Sheet Splitter eller Slicer, delar upp ett spriteark i enskilda bilder. Ett spriteark är en bild där många lika stora bildrutor från en animation eller olika ikoner ligger sida vid sida i ett rutnät. På så sätt kan spel läsa in en enda fil i stället för hundratals små bilder. Men för redigering, Mods eller andra verktyg behöver du ofta bildrutorna var för sig igen.

Lägg till arket i verktyget. Oftast identifieras rutnätet automatiskt. Annars ställer du in kolumner och rader eller storleken på en sprite. Kontrollera rutnätet i förhandsvisningen och spela upp animationen med 1 till 60 bilder per sekund. När varje bildruta sitter rätt laddar du ner alla bildrutor som en ZIP-fil eller väljer först ut dem du vill ha med ett klick. Det tar oftast mindre än en minut.

Ja, för PNG- och GIF-filer med genomskinlighet. Verktyget letar efter genomskinliga mellanrum mellan sprites och beräknar kolumner, rader, marginal och avstånd utifrån dem. Det känner också igen enfärgade skiljelinjer mellan bildrutorna. En JPG-fil har ingen genomskinlighet, så där ställer du in rutnätet själv med kolumner och rader eller sprite-storlek. Verktyget beräknar det andra värdet. Om identifieringen blir fel korrigerar du den under ”Justera rutnät”. ”Identifiera automatiskt” återställer det identifierade rutnätet.

Offset är marginalen upptill och till vänster innan den första framen börjar. Spacing är avståndet mellan två frames, till exempel en 2 pixlar bred skiljelinje. Spacing räknas bara mellan frames, inte efter den sista. Verktyget visar pixlar som blir över till höger eller längst ned som oanvänd yta.

Ja. Verktyget öppnar en animerad GIF direkt i GIF-läge och delar upp animationen i upp till 200 bildrutor. Varje bildruta sätts ihop fullständigt, även om GIF-filen bara lagrar ändrade områden. Du laddar ner bildrutorna som PNG-filer eller samlade i en ZIP-fil. Om GIF-filen egentligen är ett spriteark stänger du av ”Exportera GIF-bildrutor”. Då använder verktyget den första bilden som ark. Det är alltså både en Sprite Sheet Cutter och en GIF Splitter.

Enskilda PNG-filer, en per bildruta, som vid behov samlas i en ZIP-fil. PNG är förlustfritt och bevarar genomskinlighet även om originalet är en JPG-fil. Ett sprite sheet på 274 × 138 px med 8 kolumner, 4 rader, offset 2 px och mellanrum 2 px ger 32 rutor på 32 × 32 px vardera, sparade från sprite_00.png till sprite_31.png i en ZIP-fil. Namnen följer ett mönster med {index}, {row} och {col}; standard är sprite_{index}. Numreringen börjar på 0 eller 1 och kan fyllas ut med nollor. Dubbletter får suffixet _2, _3 i ZIP-filen.

Verktyget är gratis och kräver inget konto. Bilden läses och delas upp i din webbläsare, där filen också görs tillgänglig för nedladdning. Ingenting laddas upp eller lagras. I utvecklarverktygens nätverksflik kan du se att ingen begäran med din bild skickas när den delas upp.

PNG, JPG och GIF på upp till 200 MB och 16 384 pixlar per sida. Verktyget identifierar automatiskt rutnät för bilder upp till 8192 × 8192 pixlar. Ett rutnät kan innehålla upp till 10 000 bildrutor. Det arbetar med ett jämnt rutnät: på ett masterark med block av olika cellstorlek drar du en rektangel runt ett block med ”Markera område”. Om sista raden bara är delvis fylld hjälper ”Hoppa över tomma bildrutor”. Verktyget kan inte dela upp packade texturatlaser där bildrutorna ligger utspridda.

Fler frågor?

Kontakta supporten
Sprites klara?

Hyr din egen spelserver på 60 sekunder

Testa dina Mods, texturpaket och spelidéer på en egen server med DDoS-skydd, enkel Mod-hantering och tillräcklig prestanda för din community.

4,4/5 Trustpilot32.000+ Aktiva servrarSedan 2010

Ingen konfigurering. Ingen risk. Online på några sekunder.

Flexibel avtalstidAvsluta när som helstOnline på 60 sekunder

Letar du efter fler verktyg? Visa alla bild- och designverktyg