sprite.tint
This property overlays a color on top of a sprite to tint it. This tint doesn't change the existing colors of a sprite, but is more like putting a pane of colored glass over the top of the sprite. Because of this, you may find that sprites with bold or dark colors become darker when you apply a tint.
You can assign the tint color in a number of ways, including:
- A string containing a named HTML color, such as "orange" or "teal". A full list of color names can be found at W3 Schools - Colors
- A string containing a hexadecimal color, such as "#FF7700" or "#00ADBC"
- An RGB string, like "rgb(255, 0, 127)";
Examples
var red_cow = createSprite(100, 200);
red_cow.setAnimation("cow");
red_cow.tint = "red";
var blue_cow = createSprite(200, 200);
blue_cow.setAnimation("cow");
blue_cow.tint = "#0000FF";
var ghost_cow = createSprite(300, 200);
ghost_cow.setAnimation("cow");
ghost_cow.alpha = 0.5;
drawSprites();

Syntax
sprite.tint = "blue";
Returns
Tips
- A full list of color names can be found at W3 Schools - Colors.
- For more specific color selection, or to randomize color selection, use
gamelab/rgb()
as a parameter to fill instead of a color name. - You can make a sprite transparent by giving it a tint with alpha transparency (using the fourth optional parameter of
gamelab/rgb()
). If you want to make a sprite semi-transparent without changing it's color, use white as the tint color with an additional alpha transparency parameter (eggamelab/rgb(255, 255, 255, 0.5)
for 50% transparent). - Sprites all have the same properties and you use the dot notation (combining the name of the sprite, followed by a dot, with the label of the property) to both access and update the property for that sprite.
- Any changes to the properties of a sprite will not be seen until after
drawSprites()
is called.
Found a bug in the documentation? Let us know at support@code.org.