Phaser API Documentation

  Version: 
Filter
This is a beta release of our new docs system. Found an issue?
Please tell us about it in the #📖-newdocs-feedback channel on the Phaser Discord
Namespace: BlendModes
Phaser.BlendModes
Source: src/renderer/BlendModes.js (Line 7)

Members

<static, constant> ADD: number
Focus
Focus

Description:

Add blend mode. For Canvas and WebGL. Where both shapes overlap the color is determined by adding color values.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> COLOR: number
Focus
Focus

Description:

Color blend mode. For Canvas only. Preserves the luma of the bottom layer, while adopting the hue and chroma of the top layer.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> COLOR_BURN: number
Focus
Focus

Description:

Color Burn blend mode. For Canvas only. Divides the inverted bottom layer by the top layer, and then inverts the result.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> COLOR_DODGE: number
Focus
Focus

Description:

Color Dodge blend mode. For Canvas only. Divides the bottom layer by the inverted top layer.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> COPY: number
Focus
Focus

Description:

Copy blend mode. For Canvas only. Only the new shape is shown.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> DARKEN: number
Focus
Focus

Description:

Darken blend mode. For Canvas only. Retains the darkest pixels of both layers.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> DESTINATION_ATOP: number
Focus
Focus

Description:

Destination-out blend mode. For Canvas only. The existing canvas is only kept where it overlaps the new shape. The new shape is drawn behind the canvas content.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> DESTINATION_IN: number
Focus
Focus

Description:

Destination-in blend mode. For Canvas only. The existing canvas content is kept where both the new shape and existing canvas content overlap. Everything else is made transparent.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> DESTINATION_OUT: number
Focus
Focus

Description:

Destination-out blend mode. For Canvas only. The existing content is kept where it doesn't overlap the new shape.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> DESTINATION_OVER: number
Focus
Focus

Description:

Destination-over blend mode. For Canvas only. New shapes are drawn behind the existing canvas content.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> DIFFERENCE: number
Focus
Focus

Description:

Difference blend mode. For Canvas only. Subtracts the bottom layer from the top layer or the other way round to always get a positive value.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> ERASE: number
Focus
Focus

Description:

Alpha erase blend mode. For Canvas and WebGL.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> EXCLUSION: number
Focus
Focus

Description:

Exclusion blend mode. For Canvas only. Like difference, but with lower contrast.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> HARD_LIGHT: number
Focus
Focus

Description:

Hard Light blend mode. For Canvas only. A combination of multiply and screen like overlay, but with top and bottom layer swapped.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> HUE: number
Focus
Focus

Description:

Hue blend mode. For Canvas only. Preserves the luma and chroma of the bottom layer, while adopting the hue of the top layer.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> LIGHTEN: number
Focus
Focus

Description:

Lighten blend mode. For Canvas only. Retains the lightest pixels of both layers.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> LIGHTER: number
Focus
Focus

Description:

Lighten blend mode. For Canvas only. Where both shapes overlap the color is determined by adding color values.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> LUMINOSITY: number
Focus
Focus

Description:

Luminosity blend mode. For Canvas only. Preserves the hue and chroma of the bottom layer, while adopting the luma of the top layer.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> MULTIPLY: number
Focus
Focus

Description:

Multiply blend mode. For Canvas and WebGL. The pixels are of the top layer are multiplied with the corresponding pixel of the bottom layer. A darker picture is the result.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> NORMAL: number
Focus
Focus

Description:

Normal blend mode. For Canvas and WebGL. This is the default setting and draws new shapes on top of the existing canvas content.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> OVERLAY: number
Focus
Focus

Description:

Overlay blend mode. For Canvas only. A combination of multiply and screen. Dark parts on the base layer become darker, and light parts become lighter.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SATURATION: number
Focus
Focus

Description:

Saturation blend mode. For Canvas only. Preserves the luma and hue of the bottom layer, while adopting the chroma of the top layer.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SCREEN: number
Focus
Focus

Description:

Screen blend mode. For Canvas and WebGL. The pixels are inverted, multiplied, and inverted again. A lighter picture is the result (opposite of multiply)

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SKIP_CHECK: number
Focus
Focus

Description:

Skips the Blend Mode check in the renderer.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SOFT_LIGHT: number
Focus
Focus

Description:

Soft Light blend mode. For Canvas only. A softer version of hard-light. Pure black or white does not result in pure black or white.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SOURCE_ATOP: number
Focus
Focus

Description:

Source-out blend mode. For Canvas only. The new shape is only drawn where it overlaps the existing canvas content.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SOURCE_IN: number
Focus
Focus

Description:

Source-in blend mode. For Canvas only. The new shape is drawn only where both the new shape and the destination canvas overlap. Everything else is made transparent.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> SOURCE_OUT: number
Focus
Focus

Description:

Source-out blend mode. For Canvas only. The new shape is drawn where it doesn't overlap the existing canvas content.

Type:
number
Since: 3.0.0
Focus
Focus
<static, constant> XOR: number
Focus
Focus

Description:

Xor blend mode. For Canvas only. Shapes are made transparent where both overlap and drawn normal everywhere else.

Type:
number
Since: 3.0.0
Focus
Focus