Phaser API Documentation

  Version: 
addGradient([color1], [color2], [alpha], [fromX], [fromY], [toX], [toY], [size])

Description:

Adds a Gradient effect.

The gradient overlay effect is a visual technique where a smooth color transition is applied over Game Objects, such as sprites or UI components. This effect is used to enhance visual appeal, emphasize depth, or create stylistic and atmospheric variations. It can also be utilized to convey information, such as representing progress or health status through color changes.

Parameters:

name type arguments Default description
color1 number <optional> 0xff0000

The first gradient color, given as a number value.

color2 number <optional> 0x00ff00

The second gradient color, given as a number value.

alpha number <optional> 0.2

The alpha value of the gradient effect.

fromX number <optional> 0

The horizontal position the gradient will start from. This value is noralized, between 0 and 1 and is not in pixels.

fromY number <optional> 0

The vertical position the gradient will start from. This value is noralized, between 0 and 1 and is not in pixels.

toX number <optional> 0

The horizontal position the gradient will end at. This value is noralized, between 0 and 1 and is not in pixels.

toY number <optional> 1

The vertical position the gradient will end at. This value is noralized, between 0 and 1 and is not in pixels.

size number <optional> 0

How many 'chunks' the gradient is divided in to, as spread over the entire height of the texture. Leave this at zero for a smooth gradient, or set higher for a more retro chunky effect.

Returns:
Description:

The Gradient FX Controller.

Since: 3.60.0