Pixel art editor guide

Overview

Pixel art editor draws small pictures one square at a time, from short lists of colours.

The pixel-art tree on its dark checkerboard with faint grid lines, as the tool opens
The 16 × 16 tree the tool opens with, on the see-through checkerboard with the grid showing.

Each square of the grid is one pixel. A drawing is 8, 16, 32 or 64 squares across, the canvas size, which is the scale of a game sprite.

Old consoles and home computers could show only a few colours. Each pixel stored a number that pointed into a short list, and that is indexed colour. The NES, Game Boy, C64 and PICO-8 palettes here are lists of that kind.

The palettes are lists to pick from. Each square keeps the colour you drew it with, so changing the palette later does not recolour the drawing.

Eight tools draw, fill, pick colours and move the view. Saving makes every square a block of 1, 4, 8 or 16 pixels, repeated without blur, so the edges stay sharp.

Open Pixel art editor Start here

In this guide

  1. StartWhat you need, your first drawing, and the mouse and touch moves.
  2. Every controlEvery tool and control, one line each.
  3. Three looksThree pictures and the settings that made them.
  4. Keep your workThe PNG at four sizes, and the copy.
  5. KeysA letter for each tool, plus undo and redo.
  6. HelpWhat to do when something goes wrong.

It runs in your browser on a 2D canvas, with no WebGL. Nothing is uploaded, and nothing is kept when you leave the page. A mouse, a trackpad, a pen and a finger all work.