Phaser character sprites from a photo.

One photo in, a browser-game character out. The pack's fixed 4×4 grid is exactly what Phaser's load.spritesheet wants — frame size, start/end ranges, four anims, done in about ten lines.

Make a sprite — $5

No account · ZIP in minutes · money-back if it fails QA (handled manually during beta)

Phaser wants a grid — the pack is one

Phaser 3's load.spritesheet assumes the one thing sloppy sprite sources never guarantee: every frame the same size, on an exact grid, in a predictable order. That's the whole pack. The sheet is 4×4 with 96×96 frames (a 48px set ships too), rows ordered down, left, right, up, feet aligned to a shared baseline so nothing bobs.

Loadload.spritesheet · frameWidth 96 · frameHeight 96

walk_downframes 0–3

walk_leftframes 4–7

walk_rightframes 8–11

walk_upframes 12–15

frameRate8 · repeat −1

Each anim is one this.anims.create call with generateFrameNumbers('hero', { start, end }) from the table above. With the loader line and four anims you're at roughly ten lines of code — the rest is your game.

Two settings that keep it crisp

pixelArt: true in the game config — Phaser then uses nearest-neighbor scaling and disables anti-aliasing, so the sprite stays sharp at any zoom.
Integer scale factors where you can — 2× and 3× look chunky and intentional; 1.37× shimmer is nobody's aesthetic.

No left-flip hacks needed: the sheet has a real left row, so asymmetric details (hair part, glasses glare, chest print) stay on the correct side — setFlipX stays out of your codebase.

Your photo, running in the browser

→ your sprite The same person as a walking Phaser-ready game sprite

Proof it works at game speed: Stonk Runner, our free browser autorunner, runs photo-forged packs as its entire cast. That's the same pipeline your photo goes through.

What's in the $5 pack

sprite-sheet-96 / 48 .png4×4 transparent sheets — the Phaser input

frames96/ + frames48/16 loose PNGs each, if you prefer an atlas workflow

strips/ ×8per-direction strips

walk/ ×4looping GIFs for your itch page

manifest.jsonrow/column order + QA notes

One-time $5, commercial use included. If your project later jumps engines, the same pack imports into Godot and Unity just as cleanly.

Frequently asked questions

How do I load a PixelForge sheet in Phaser 3?

this.load.spritesheet('hero', 'assets/sprite-sheet-96-transparent.png', { frameWidth: 96, frameHeight: 96 }) in preload(). The 48px sheet works the same way with 48s.

Which frames belong to which direction?

Rows top to bottom: down (0–3), left (4–7), right (8–11), up (12–15). Use generateFrameNumbers with those start/end pairs.

Why is my pixel art blurry in Phaser?

Set pixelArt: true in your game config. Phaser then scales with nearest-neighbor instead of smoothing.

Does it work with Phaser's arcade physics?

Yes — it's a normal sprite. Add it with this.physics.add.sprite, set a body size a bit narrower than the frame (characters aren't 96px wide), and drive velocity from cursors.

Can I use it in a commercial web game?

Yes — commercial use is included, no royalties. Details on the licensing page.

Put anyone into your game.

$5 · one photo · 4-direction walk pack · no subscription