Building a Drawing App in Scratch

What is a drawing app?

A drawing app turns your mouse into a paintbrush: hold the button and drag to draw, let go to stop, pick colours, change the brush size, and clear the page to start over. You use apps like this all the time, and in Scratch you can build one yourself using the Pen — a special set of blocks that let a sprite leave a coloured trail wherever it goes.

This lesson builds a real, usable paint program step by step. If Scratch is new to you, start with getting started with Scratch. The pen is the star of this project, so the lesson on drawing with the pen in Scratch makes a great companion if you want more pen practice.

The big idea: the pen leaves a trail

Imagine a sprite holding a pen. When the pen is down, every place the sprite moves to gets connected by a coloured line — it draws as it travels. When the pen is up, the sprite can move freely without leaving a mark. A drawing app is really just this: make the sprite follow your mouse, put the pen down while you hold the button, and lift it when you let go.

Step 1: Add the Pen extension

The pen blocks are not in Scratch by default — you add them.

1. Click the Add Extension button (bottom-left of the screen, the blue square with a plus).
2. Choose Pen. A new category of green-blue blocks appears, including pen down, pen up, set pen color to, change pen size by and erase all.

Step 2: Make a brush sprite that follows the mouse

You can use the cat, but a small dot is nicer. Draw a tiny filled circle as your brush sprite, or just shrink the cat. Then give it this script:

when green flag clicked
erase all
pen up
forever
  go to (mouse-pointer v)

Click the green flag and move your mouse — the brush follows it everywhere. The erase all at the top clears any old drawing. Nothing draws yet because the pen is up. That is next.

Step 3: Draw only while the mouse is held

We want lines only when the button is pressed. Update the forever loop to check mouse down?:

when green flag clicked
erase all
pen up
forever
  go to (mouse-pointer v)
  if <mouse down?> then
    pen down
  else
    pen up

Now press and hold the mouse button and drag — you draw! Let go, move somewhere else, press again, and a new stroke begins. The if mouse down? block decides every frame whether the pen should be touching the page. This "hold to draw" behaviour is exactly how real paint apps work.

Step 4: Set a starting colour and size

Before drawing, it is nice to pick a sensible pen. Add two blocks to the setup:

when green flag clicked
erase all
pen up
set pen color to (blue)
set pen size to (5)
forever
  go to (mouse-pointer v)
  if <mouse down?> then
    pen down
  else
    pen up

set pen color to opens a colour picker; choose any starting colour. set pen size to (5) makes a medium brush. Bigger numbers paint thicker lines.

Step 5: Change colours with the keyboard

A drawing app needs more than one colour. The quickest way is to let keys switch colours. Add these separate scripts to the brush sprite (each runs when its key is pressed):

when [r v] key pressed
set pen color to (red)

when [g v] key pressed
set pen color to (green)

when [b v] key pressed
set pen color to (blue)

Now while you draw, tap R, G or B to switch colours instantly. You can add as many as you like. (Want clickable colour buttons instead of keys? Make small coloured button sprites and use when this sprite clicked to set the pen colour — see events and buttons in Scratch.)

Step 6: Change brush size and clear the canvas

Two more handy tools. Let the up and down arrows change the brush size, and the space bar clear everything:

when [up arrow v] key pressed
change pen size by (2)

when [down arrow v] key pressed
change pen size by (-2)

when [space v] key pressed
erase all

Press up for a thicker brush, down for thinner, and space to wipe the page clean and start again. Your drawing app now has colours, brush sizes and an eraser.

The full brush script

The brush sprite's main script stays short — most features are small key-press scripts:

when green flag clicked
erase all
pen up
set pen color to (blue)
set pen size to (5)
forever
  go to (mouse-pointer v)
  if <mouse down?> then
    pen down
  else
    pen up

Plus the key scripts from Steps 5 and 6 for colours, size and clearing.

Common mistakes and how to fix them

• It draws all the time. You called pen down once instead of checking mouse down? each frame. Use the if mouse down? / else pen up pattern.
• A line jumps across the page. The pen never lifted between strokes. Make sure pen up runs when the button is released.
• Nothing draws at all. You skipped adding the Pen extension, or the brush sprite is hidden. Add the extension and make sure the sprite is shown.

Reading your scripts in order to find these problems is called debugging, and every coder does it.

Try it: make it your own

You have a working drawing app. Now extend it:

• Rainbow pen: instead of fixed colours, add change pen color by 2 inside the draw loop so the line cycles through the rainbow as you draw.
• A real eraser: make a key that sets the pen colour to the background colour, so you can rub out parts of the drawing.
• Stamp shapes: add a sprite with star or heart costumes and use the stamp block to print shapes where you click.
• Save your art: Scratch can't save the picture directly, but you can take a screenshot to keep your masterpiece.

The pen is one of the most creative tools in Scratch — it powers spirographs, fractals and art generators. Once this clicks, try drawing with the pen in Scratch for pattern ideas. Happy painting! 🎨