Pixel Rumble

Pixel art editor & sprite sheet tools

Stage 01 · free play

Pixel art editor

Draw sprites, icons and tiles on a grid from 8 to 128 pixels, with mirror mode, retro console palettes and crisp PNG export at up to 32×. It all runs in this tab.

X – · Y – —
20×

Keyboard: focus the canvas, move the cursor with the arrow keys and press Space to draw. For lines and rectangles press Space at each end. Esc cancels.

Colours

Click a swatch for the primary colour; right-click or Shift+click for the secondary. Transparent is the eraser colour.

Canvas

Export

10× · 160 × 160 px

How to draw with the editor

Pick a canvas size first: 16 × 16 is the classic size for items and icons, 32 × 32 for characters, and 64 or more for portraits and scenes. Change it at any time with Resize, which keeps what you have drawn (anchored at the top left, or centred if you tick the box).

Draw with the left mouse button in the primary colour and with the right button in the secondary colour, which starts out transparent, so right-click erases. The fill tool floods one connected area of the same colour; the line and rectangle tools draw when you let go, and holding Shift keeps lines straight or at 45° and rectangles square. The eyedropper copies a colour from the canvas.

Turn on mirror mode to draw symmetrical sprites in half the time. Every action can be undone, and your current drawing is kept in this browser until you clear it.

When you are done, choose a scale and download the PNG. At 1× each pixel is one pixel, which is what game engines expect; larger scales are for sharing and printing, because every pixel becomes a crisp square block.

Keyboard shortcuts

KeyAction
B E GPencil, eraser, fill
L R ILine, rectangle, eyedropper
FFilled or outlined rectangles
M, Shift+MMirror left–right, top–bottom
XSwap primary and secondary colour
Ctrl+Z, Ctrl+YUndo, redo (⌘ on a Mac)
+ − 0Zoom in, zoom out, fit
#Grid lines on or off

More stages

Five more tools for sprites, palettes and animation.

Questions

Is my drawing saved?

Yes, on this device. The editor keeps your current drawing in your browser's local storage, so it is still there when you come back. Nothing is uploaded. Download a PNG to keep a copy or to move your work to another device.

Why does my PNG look blurry in another app?

The file itself is sharp: every pixel is written as a solid square block. Blur comes from apps that smooth an image when they enlarge it. Export at the size you need with the scale slider, for example 8× for a 32 px sprite shown at 256 px, instead of letting the other app stretch a 1× file.

Can I edit a sprite I already have?

Yes. Import PNG opens it on the canvas, up to 128 × 128 pixels. If it is pixel art that was saved enlarged, the editor finds the block size and shrinks it back to one pixel per block. Larger pictures are scaled down to fit; for photos, the image to pixel art tool gives better results.

What does mirror mode do?

It paints every stroke a second time, reflected across the centre line: left to right, top to bottom, or both for four-way symmetry. It works with the pencil, eraser, fill, line and rectangle tools, which makes faces, ships, items and tiles much quicker to draw.

Can I animate in the editor?

The editor draws one image at a time and has no layers or timeline. To animate, draw each frame and download it, or draw the frames side by side on one wider canvas, then cut them apart with the sprite sheet slicer and turn them into a GIF with the GIF maker.