Set Up Your Canvas

Lesson 1 of 6 · Beginner · 5 min

What you will make
A named 16 × 16 project with a transparent canvas, saved in your Workspace.

Your progress0 / 6

Lesson checklist

Compare your own work with these checkpoints. Check each one when your result is ready.

My canvas is 16 × 16 pixels.I can see the checkerboard across the empty canvas.I named my project and saved it before returning.

0 of 3 checked

No account needed. Learning progress is saved in this browser.

This lesson's project

Not created yet

Create My First Slime, test the pencil and undo, then return with an empty, transparent canvas.

Practice in the editor

Open a 16 × 16 practice canvas with lesson examples and onion skin enabled. Your work saves automatically to My projects.

No account needed. Up to 3 projects.… / 3 used. Projects are saved automatically in this browser.

Starter files and backup import

Follow the steps

Give your first character a small, clear space to grow.

Start with: No drawing experience needed. Use a browser that allows local storage, and a mouse, trackpad or touch screen.

1
Open your practice canvas
Use the practice button below. It creates a transparent 16 × 16 project with the course palette ready. If you already started, the same button reopens your work.
One empty frame on a 16 × 16 canvas.
2
Name it and find the grid
Rename the project in the editor's top bar to My First Slime. Use the grid button to reveal the individual pixels, then zoom until you can comfortably place one square at a time.
A named project and a clearly visible pixel grid.
3
Try one pixel, then undo
Choose the pencil and click once inside the canvas. Undo with the toolbar or Ctrl/⌘+Z. The checkerboard should reappear where the pixel was; that tells you the background is still transparent.
A blank canvas, with no white background painted in.
4
Save and come back
Use Save & return to lesson in the course bar. This waits for the project to save before leaving the editor. Your project also appears in the Workspace.
Your starting project is ready for lesson two.

See the technique

Your starting canvas

Where we're heading

Both images use exactly 16 × 16 pixels. Zoom makes each pixel easier to place; it does not add detail to the file. The checkerboard is a preview of empty space and is never painted into your PNG.

Learning notes and references

Choose a canvas that matches the asset, not your screen.
Tell the pixel grid apart from the transparency checkerboard.
Save a project you can return to throughout the course.

Pixel Art Resolution Guide 8×8 vs 16×16 vs 32×32 Pixel Art

Follow the steps

Give your first character a small, clear space to grow.

Start with: No drawing experience needed. Use a browser that allows local storage, and a mouse, trackpad or touch screen.

Open your practice canvas

Use the practice button below. It creates a transparent 16 × 16 project with the course palette ready. If you already started, the same button reopens your work.

One empty frame on a 16 × 16 canvas.

Name it and find the grid

Rename the project in the editor's top bar to My First Slime. Use the grid button to reveal the individual pixels, then zoom until you can comfortably place one square at a time.

A named project and a clearly visible pixel grid.

Try one pixel, then undo

Choose the pencil and click once inside the canvas. Undo with the toolbar or Ctrl/⌘+Z. The checkerboard should reappear where the pixel was; that tells you the background is still transparent.

A blank canvas, with no white background painted in.

Save and come back

Use Save & return to lesson in the course bar. This waits for the project to save before leaving the editor. Your project also appears in the Workspace.

Your starting project is ready for lesson two.