Draw on a blank pixel grid
Use brush, eraser, fill, line, rectangle, and selection tools with a visible cell grid.
Pixel Art Editor
Draw on a blank pixel canvas with a brush, eraser, fill, line, and rectangle tools. Organize frames and layers, preview a short animation, and export a PNG, spritesheet, or GIF. Your art stays in this browser session.
Pixel canvas
24 × 24 pixels
Keyboard: focus the canvas, use arrow keys to move, then press Space or Enter to paint.
Frames
Preview stopped
Features
Explore what this workspace can do, how each control affects the result, and which export fits your next step.
Separate art into layers
Add, rename, hide, and select layers within the current frame.
Animate with frames
Duplicate or add frames, set playback speed, and preview a looping sprite.
Export the result
Download the current frame as PNG, all frames as a horizontal spritesheet, or the animation as GIF.
Draw, layer, animate, and export pixel art
Work at the cell level: set a canvas size, paint on layers, add frames, preview motion, then choose an export.
Choose a canvas size
Start with the animated sample or create a new blank canvas at a supported pixel dimension.
Draw with a small palette
Choose a color and tool, then paint on the selected layer. Add layers for details you want to keep separate.
Preview and export
Add frames, adjust playback, inspect the loop, and download PNG, spritesheet, or GIF.
Frames and layers solve different editing needs
A layer separates parts of one image so you can edit or hide them independently. A frame is a complete animation moment. The preview combines visible layers in the active frame, then plays frames in timeline order.
This is a lightweight, browser-session editor. It does not save a native project file or preserve work after the page is closed, so export images before leaving.
Choose the export for the destination
PNG downloads the active frame at the canvas pixel dimensions. The spritesheet places frames side by side for tools that accept a horizontal strip; GIF contains the timed loop.
Check frame order, canvas transparency, and playback speed in the preview before using the exports in a game or another editor.
Pixel art editor questions
Can I draw pixel art from a blank canvas?
Yes. Choose a canvas size and use the brush, eraser, fill, line, or rectangle tool to draw cell by cell.
Can I add layers?
Yes. Add and name layers, select the active layer, or hide a layer while editing the current frame.
Can I animate a pixel sprite?
Yes. Add or duplicate frames, set the playback speed, and preview a loop in the editor.
What is included in a spritesheet export?
It places the animation frames in timeline order in one horizontal PNG strip, with each frame using the same canvas dimensions.
Can I export an animated GIF?
Yes. The GIF export uses the current frames and playback delay shown in the animation settings.
Can I edit an existing image?
This editor is for drawing on its pixel canvas. Use the separate image-to-pixel-art tool to convert a photo or illustration into editable cells.
Does the editor support transparency?
Yes. Erased cells remain transparent in the PNG, spritesheet, and GIF output.
Does it autosave my sprite?
No. The editor keeps the drawing in the active browser session. Download the files you need before refreshing or closing the page.
Does a layer belong to every animation frame?
Layers are edited within the active frame. Duplicate a frame when you want to carry its current layer artwork into another animation moment.
Are the sample frames my only starting point?
No. Choose New blank to clear the sample and start with an empty canvas at the selected dimensions.