Draw a sprite

A 32×32 character with its outline, fill, and shading on separate layers is the foundation almost every other guide builds on. Animation, skin variants, and cleanups all need the parts kept separate.

You end up with a finished 32×32 character sprite with named layers.

Pick the canvas size

Pixel art doesn’t scale cleanly, so design at the target resolution. UI icons and small items are often 16×16. Retro character sprites are 16×16 or 32×32. Modern-retro characters lean 32×32 or 64×64. Bosses and large props sit at 64×64 or 128×128, and title-card or full-screen art at 128×128 or 256×256.

If you followed the Quickstart you already have a 32×32 project. If not, make one: New Project, name it goblin_scout_v1, 32×32, create.

Set up three layers

You’ll keep the outline, the body fill, and the shading on separate layers so each can be edited or hidden without disturbing the others.

In the timeline at the bottom, click New Layer to add a second layer. Drag it above the default if it lands below. Rename the layers by clicking their names: call the top one outline, the middle one body, and add a third called shading above body. You should now have, top to bottom: outline, shading, body.

Draw the silhouette outline

Select the outline layer by clicking its row. Select the Pencil (B) and set Brush Size to 1 px in Tool Options on the right. Pick a dark foreground color, near-black works well. Zoom in with Ctrl+= until the canvas fills most of the screen.

Draw the character’s silhouette as a closed outline: a simple standing pose with head, body, two legs, and two arms. Press Ctrl+Z whenever a stroke goes wrong.

If your outline picks up diagonal staircasing you don’t want, the Contour tool (C) draws 4-connected paths that stay clean by design. Switch to it for the long silhouette edges and come back to Pencil for details.

Fill the body

Select the body layer. Switch to the Fill tool (Shift+G), pick a base body color in the foreground swatch, and click inside the outline. The body fills with that color.

If the fill floods the whole canvas, the outline has a gap. Undo with Ctrl+Z, switch back to the outline layer, zoom in on the perimeter and find the open pixel, close it, then refill. This is the most common failure at this step and it’s always a one-pixel gap.

Add shading on its own layer

Select the shading layer. With the Pencil at 1 px, add a darker shade along one side of the character and a lighter highlight on the other. Decide where the light comes from before you start and stick to it. Consistent lighting keeps a sprite clean at 1×.

Keeping shading separate means you can recolor or reskin later without redrawing. At 32×32, three to five shades per material is plenty; more tends to look muddy.

(Optional) Add a ground shadow

A separate shadow layer at the bottom of the stack makes the sprite sit on a ground plane and is easy to hide on jump frames during animation. Add a layer, rename it shadow, drag it below body, and draw a flat translucent oval at the character’s feet.

Save

Press Ctrl+S. The sprite now exists in your project library and survives closing the editor.

From here you can build a palette to lock down the colors, or push the sprite into a walk cycle.