DOCS
Building games

Pixel Artist

A real pixel-art editor in the browser — layers, frames, onion skin, selections, and Aseprite import.

The Pixel Artist is for drawing by hand. Not "generate a sprite and hope" — an actual pixel editor, with the things that make pixel art possible: a layered document, a frame timeline, onion skin, and selections you can transform.

It exists because generating art gets you a starting point. A walk cycle that reads right, a 16×16 icon that survives being small, a tileset whose edges line up — those are hand work.

The document

A sprite here is a grid of cels: one per layer per frame. The PNG is the export, not the document — layers and frames are kept alongside it, so closing and reopening a sprite gets your layers back rather than a flattened image.

Canvas up to 256×256. Anything bigger belongs in the Image Editor.

Layers

Add, delete, reorder, rename, hide, lock, set opacity, merge down, flatten. Blend modes are normal and multiply.

Undo history is per cel, which is what you want: undoing on the character's outline layer does not undo the shading you did after it on another layer.

Frames and animation

The timeline along the bottom is layers × frames, arranged the way Aseprite arranges it.

  • Add, duplicate, delete and reorder frames.
  • Onion skin — the previous frame ghosted underneath the one you're drawing. This is the single most useful feature for animation, and the reason hand-drawn motion is possible at all.
  • Playback — watch the loop while you work.
  • Export to a spritesheet — the frames become a spritesheet asset the game can play, and that asset re-opens here as a document. Re-exporting matches frames by index, so an added frame appends rather than shuffling everything.

Drawing

Pencil, line, rectangle, ellipse, bucket, eraser, colour picker, plus a round brush and adjustable size. A palette on the left, tools on the right, timeline at the bottom, tool options along the top — deliberately Aseprite's layout, with its key bindings.

Four things that change how a stroke lands, each solving a specific problem:

ModeWhat it fixes
Pixel-perfect strokesRemoves the doubled corner pixels a freehand diagonal leaves behind.
Tiled drawingThe canvas wraps at the edges, so you draw a seamless tile and see that it's seamless.
Symmetry (X / Y)Mirrors your stroke. Faces, ships, UI frames.
Replace colour / outlineSwap one colour everywhere; add a clean outline around what's drawn.

Selections

The selection is a mask, not just a rectangle: magic wand and lasso as well as marquee. On a selection you can flip, rotate by quarter turns, rotate freely (with pixel-art-aware rotation rather than a blurry resample), and scale. Cut, copy and paste work across cels and frames.

Coming from Aseprite

You can import a .aseprite file — layers, frames, cels, palette, tags and timing all come across. There is no export back to .aseprite; export to a spritesheet or a PNG instead.

Generating into it

The Pixel Artist's Generate action has two options, both pixel-art specific:

  • Pixel sprite — one sprite from a prompt, optionally matching the style of a sprite you already have.
  • Map object — a top-down prop, rendered for top-down maps.

The result opens on the canvas, where you clean it up. That is the intended loop: generate the base, fix it by hand.

For a recognisable character, generate rather than hand-draw the first pass — hand-painted complex subjects look crude, and the generator's output is a better starting point than a blank canvas. For icons, glyphs and items, either way works.

Next steps

On this page