Course Sample for Our Web Game Design Curriculum
HTML5 Canvas and JavaScript Lesson 3: Screen Coordinates and Colors
This week we are going to take a closer look at the way we specify locations and colors on the <canvas> drawing surface.
FillStyle Colors
Remember last week that we selected a color for our filled-in shapes using the fillStyle property:
ctx.fillStyle = “blue”;
The fillStyle property is very flexible, and can be used to choose a solid color or even a gradient or pattern! You can use several different formats to choose a color. Here are a few of the color options:
Open your existing “index.html”. Try setting the fillStyle using the rgb() pattern with red, green, and blue components. What interesting colors can you make that don’t match any pre-defined name?
To view a full sample of this course, click here.
![Select Plan](/wp-content/uploads/SelectPlan-1.png")
