Build Your Own Scratch Painting App: A Fun Scratch Coding Tutorial for Kids

Are you looking for a fun way to introduce your child to the world of Scratch programming? Want to help them build something creative while learning block programming? Then you’re in the right place!

Scratch Painting App Tutorial: Create Color Palettes, Brush Sizes & Eraser Tool

In this tutorial, we’ll walk you through creating a painting app in Scratch—a project that combines creativity, problem-solving, and interactive design. Using Scratch’s pen extension, you’ll build an interactive drawing app complete with a color palette, brush size controls, and an eraser tool!

Watch the full tutorial here:

What Will You Learn?

By the end of this blog and video, you’ll master:

How to use the Pen extension in Scratch
How to create an interactive Scratch color palette
How to implement brush size controls using variables
How to add an eraser tool in Scratch
How to build your own Scratch drawing app from scratch!
How to use drag and drop programming blocks effectively

Whether you’re a parent, a coding instructor, or a curious learner, this Scratch project is perfect for teaching coding games for kids while fostering creativity.

Tools & Concepts Used

Scratch 3.0
Pen extension in Scratch
Variables (Size, Color)
Motion, Control, Looks, Events, Sensing, and Operators blocks
Custom sprites (Color buttons, eraser, and canvas)
Basic block programming logic

Step-by-Step Coding: Building a Scratch Painting App

Let’s break down the process into clear steps with code examples.

Step 1: Set Up Your Scratch Project

👀 Watch this section in video: Set Up Your Scratch Project

Open Scratch 3.0 and create a new project.
Delete the default cat sprite.
Click “Choose a Sprite” → “Paint” to draw a blank canvas.
Name this sprite Canvas.

Code for Canvas Sprite

when green flag clicked
set [Color v] to [black]
erase all
go to [Mouse pointer v]
forever
    go to [mouse pointer v]
    if <mouse down?> then
        pen down
    else
        pen up
    end
end

💡 This is the core drawing mechanic. The pen follows the mouse and draws only when clicked.

Step 2: Add the Pen Extension

📌 Watch this short clip at Add the Pen Extension

To enable drawing, click on the “Extensions” button (bottom left) and choose the Pen extension.

Now, you’ll have access to blocks like:

pen down
pen up
set pen color to
set pen size to
erase all

Step 3: Create Variables

📌 See it in action: Create Variables

Go to the Variables tab and create two variables:

Size (controls the brush size)
Color (stores the selected color as text, e.g., “red”, “blue”)

Also, turn Size into a slider:

Right-click Size and choose slider.
Set min to 5 and max to 100 for better control.

Set Pen Size Using Size Variable

when green flag clicked
set pen size to ((Size) / 5)

Step 4: Build Your Color Palette

📌 Detailed walkthrough: Build Your Color Palette

Paint several circle sprites with solid colors like red, blue, green, yellow, and black. Remove outlines.

For each, name the sprite accordingly (e.g., Red, Blue).

Example: Code for Red Palette Sprite

when green flag clicked
go to x: (-150) y: (140)
forever
    if <touching [mouse pointer v]> then
        set [brightness v] effect to (25)
    else
        set [brightness v] effect to (0)
    end

    if <mouse down?> then
        set [Color v] to [red]
    end
end

Repeat similar blocks for Blue, Green, Yellow, and Black.

Step 5: Set Pen Color Dynamically

📌 See it executed: Set Pen Color Dynamically

Back in your Canvas sprite, use conditionals to check which color is selected and set pen color accordingly.

if <(Color) = [red]> then
    set pen color to [#ff0000]
end
if <(Color) = [blue]> then
    set pen color to [#0000ff]
end
if <(Color) = [green]> then
    set pen color to [#00ff00]
end
if <(Color) = [yellow]> then
    set pen color to [#ffff00]
end
if <(Color) = [black]> then
    set pen color to [#000000]
end

Tip: Use the color picker to precisely match your palette buttons.

Step 6: Add the Eraser Tool

📌 Adding erase functionality: Add the Eraser Tool

Draw a rectangle sprite labeled “Eraser” with white text. This will reset the canvas.

Code for Eraser Sprite

when green flag clicked
go to x: (150) y: (140)
forever
    if <touching [mouse pointer v]> then
        set [brightness v] effect to (25)
    else
        set [brightness v] effect to (0)
    end

    if <mouse down?> then
        erase all
    end
end

Full Workflow Video

See the full process in action on YouTube:
👉 Kodex Academy – Scratch Painting App Tutorial

Enhancement Features to Try Next

Here are some project enhancement ideas to take your Scratch painting app to the next level:

1. Add a Save Feature

Scratch doesn’t support file saving, but you can encourage kids to take screenshots of their creations. Use:

say [Take a screenshot to save your painting!] for (2) seconds

2. Add a Custom Brush Type Selector

Use buttons to switch between:

Circle brush
Line brush
Spray brush (simulate using clones)

3. Add Color Picker Tool

Let users select any color using RGB sliders. Create three variables: Red, Green, Blue, and dynamically update the pen color using the RGB values.

4. Add Undo/Redo Feature

Though tricky, you can simulate it by storing last 5–10 drawing actions in a list, and restoring previous states.

5. Add Shape Drawing Tools

Implement shortcuts to draw:

Squares
Circles
Lines
Let users choose by clicking tool icons.

Educational Benefits of This Scratch Project

By building this Scratch painting game, kids will:

Learn how to code in Scratch using visual logic
Understand event-driven programming
Practice looping and conditionals
Explore creative thinking and UI design
Develop real game development logic in a simplified form

It’s one of the most rewarding fun coding activities for kids that’s both entertaining and educational.

What Makes This Project Great for Scratch Coding Classes?

This painting app is ideal for teachers running Scratch coding classes. Here’s why:

Easy to scaffold in multiple sessions
Introduces core programming concepts visually
Allows personalization and creativity
Engages students with immediate visual feedback
Prepares kids for more advanced Scratch game tutorials

Looking for more Scratch tutorials? Check out Scratch’s official guides.

Final Thoughts

Building a Scratch painting app is a perfect blend of fun and education. Whether you’re a young coder or a mentor guiding students, this project is a great way to explore the power of drag and drop programming in Scratch.

If you enjoyed this guide, be sure to share it with fellow educators or parents who want their kids to learn Scratch programming in a joyful, creative way.

Don’t forget to check out the full video tutorial by Kodex Academy here: 🎥 Watch the full Scratch Painting App Tutorial
Like, comment & share the video
Visit kodexacademy.com
subscribe to the Kodex Academy YouTube channel for deeper Scratch content.

Happy coding with Kodex Academy!