CodeAgeBy Sitezack
Canvas for MakersDraw and animate your game0 XP
Chapter progress0/6

Lesson 3 of 7

Draw your car

fillStyle picks the colour, fillRect(x, y, width, height) draws a filled rectangle. The origin (0,0) is top-left!

Store your car's position in an object var car = {x: …, y: …}: that's what you'll move later.

var car = {x: 20, y: 90};
ctx.fillStyle = "#7C5CFF";
ctx.fillRect(car.x, car.y, 40, 20);

🎯 Your goal

Create the object var car = {x: 20, y: 90}, then draw the car: a 40 by 20 rectangle at position car.x, car.y (pick your colour with fillStyle).

PRO lesson

This advanced chapter is part of CodeAge PRO. Unlock it to keep your adventure going.

Discover PRO