Reference tint()

tint()

Tints images using a color.

The version of tint() with one parameter interprets it one of four ways. If the parameter is a number, it's interpreted as a grayscale value. If the parameter is a string, it's interpreted as a CSS color string. An array of [R, G, B, A] values or a p5.Color object can also be used to set the tint color.

The version of tint() with two parameters uses the first one as a grayscale value and the second as an alpha value. For example, calling tint(255, 128) will make an image 50% transparent.

The version of tint() with three parameters interprets them as RGB or HSB values, depending on the current colorMode(). The optional fourth parameter sets the alpha value. For example, tint(255, 0, 0, 100) will give images a red tint and make them transparent.

Examples

Syntax

tint(v1, v2, v3, [alpha])
tint(value)
tint(gray, [alpha])
tint(values)
tint(color)

Parameters

v1
Number:

red or hue value.

v2
Number:

green or saturation value.

v3
Number:

blue or brightness.

alpha
Number:
value
String:

CSS color string.

gray
Number:

grayscale value.

values
Number[]:

array containing the red, green, blue & alpha components of the color.

color
p5.Color:

the tint color

Notice any errors or typos? Please let us know. Please feel free to edit src/image/loading_displaying.js and open a pull request!

Related References