Sets the color used to fill shapes.
The fill color controls the interior color of shapes drawn - arc()
, ellipse()
, rect()
, regularPolygon()
, shape()
. The outline color is set using stroke()
. Until you change the fill, Game Lab will continue to draw with the color that you set.
The color parameter can take one of two forms. It can be:
rgb()
command.The default fill color is gray.
Draw a square bullseye using four colors from an array.
// Draw a square bullseye using four colors from an array. var colors = ["red", "magenta", "pink", "purple"]; for (var i = 0; i < 10; i++) { fill(colors[i%4]); // Choose a color from the array. rect(100+10*i, 100+10*i, 200-20*i, 200-20*i); }
Use the draw() function to animate a circle through multiple shades of red.
// Use the draw() function to animate a circle through // multiple shades of red. var number = 0; var count = 0; function draw() { background("white"); fill(rgb(number, 0, 0)); ellipse(200, 200, 100, 100); count=count+5; if (count<=255) { number=number+5; } else if (count<=510){ number=number-5; } else if (count>510) { count=0; } }
// Sets the fill color to cyan. fill("cyan"); rect(100, 100, 200, 200);
Demonstrate the two ways to specify the color parameter.
// Demonstrate the two ways to specify the color parameter. // Sets the color using the name of a color in a string. fill("chartreuse"); ellipse(100, 100, 100, 100); // Sets the color using a call to color with an rgba value. // The last value is the amount of transparency, a number from 0 to 1. fill(rgb(127, 255, 0, 0.5)); rect(100, 100, 200, 200);
fill(color)
Name | Type | Required? | Description |
---|---|---|---|
color | String | The color used to fill shapes or a call to the rgb() command. |
No return value. Changes future output to the display only.
strokeWeight()
and stroke()
.rgb()
as a parameter to fill instead of a color name.Found a bug in the documentation? Let us know at documentation@code.org