A pen for each shape

Challenge 5 of 12

Three different colours, though, do need three shapeColour lines — one just above each shape it should reach. Same three circles as last time, so only the pens have changed.

Match all three.

Your code JavaScript

Match all three.

Console print() output

0 / 30 frames · 400×400

Target

Yours

Results

Press Run to check your code

Penalties: none this run

Report this challenge

Lesson Colours

Colours, now that you know the shape of a sketch. Everything here happens inside everyFrame, on the lines that draw each frame.

Colours have names you can simply type, in capital letters: RED, ORANGE, YELLOW, GREEN, BLUE, PURPLE, PINK, BROWN, CYAN, MAGENTA, WHITE, BLACK and GREY. You never have to remember them — the Reference button above your code lists all thirteen, with a patch of each colour beside its name, and clicking one types it in for you.

shapeColour(RED); chooses the colour for shapes drawn after it. Think of it as picking up a coloured pen: everything you draw from then on uses that colour, until you pick up another one. So one shapeColour line can serve several shapes, and shapes that need different colours need a line each — placed just above the shape it should reach. Moving the same line higher or lower changes which shapes it affects.

backgroundColour(BLUE); paints the whole canvas instead, which is why it belongs at the top: anything drawn above it gets painted over and disappears.

In this topic you will name colours from the target picture, learn where a colour reaches, paint the canvas, and finish by changing a shape's name as well as its colour — which is where the next topic picks up.