Blend Modes

The Blend Mode Demo tutorial is a hands-on version of the workspace that generated the videos on this page.

In all of these examples, QLab is playing the ocean beach video on layer 1 at full opacity, and the aerial city video on layer 2 at full opacity. For each demonstration video, the blend mode was changed for the aerial city video on layer 2.

To keep the load time for this page reasonable, these videos are downsampled, compressed, and reduced to 15 frames per second. As a result, subtle differences between various blend modes have been slightly obscured. These samples should be used as a reference only, not as a definitive analysis.

Original Videos

Darkening Blends

• Darken creates pixels made of the darkest value from each channel of each source pixel.
• Multiply creates pixels by multiplying the channel values from each source pixel together.
• Color Burn inverts the background, divides that by the foreground, then inverts the result. The darker the background is, the more its color is visible in the result.
• Linear Burn adds the two layers then subtracts 1 from the result.

Lightening Blends

• Lighten creates pixels made of the brightest value from each channel of each source pixel.
• Screen inverts both images, multiplies them, then inverts the result.
• Color Dodge divides the background by an inverted foreground, lightening the background according to the brightness of the foreground. The brighter the foreground is, the more its color is visible in the result.
• Linear Dodge adds channel values from both layers. This decreases contrast.

Contrast Blends

• Overlay is a combination of Multiply and Screen; background values above 0.5 lighten the foreground, background values below 0.5 darken the foreground, and background values of exactly 0.5 have no effect.
• Soft Light is also a combination of Muliply and Screen, namely a linear interpolation between the two. It can be thought of as a lightening effect similar to Overlay but using different math and therefore having a different gamma curve.
• Hard Light is also a combination of Multiply and Screen and is the inverse of Overlay; foreground values above 0.5 lighten the background, foreground values below 0.5 darken the background, and foreground values of exactly 0.5 have no effect.
• Pin Light is effectively a combination of Darken and Lighten, darkening values below 0.5 and lightening values above 0.5. The result is a reduction in mid-tones and a dramatic increase in contrast.

Arithmetic Blends

• Difference calculates pixels as the absolute value of background minus foreground. Shadows on the foreground have little to no effect while mid-tones and highlights have a darkening effect.
• Exclusion is similar to Difference, but with lower contrast; shadows have little to no effect, mid-tones pull the resulting pixels towards neutral gray, and highlights darken.
• Subtract simply subtracts the foreground from the background, with a lower limit of 0 for any value. The brighter a pixel is on the foreground, the darker it will be in the blended image. Dark pixels on the foreground have minimal effect.
• Divide divides the foreground by the background, which has the opposite effect of Subtract; dark pixels in the foreground will brighten the blended image while bright pixels in the foreground have a minimal effect.

Component Blends

• Hue combines the brightness and saturation of the background with the hue of the foreground.
• Saturation combines the brightness and hue of the background with the saturation of the foreground.
• Color combines the brightness of the background with the hue and saturation of the foreground.
• Luminosity combines the hue and saturation of the background with the brightness of the foreground.

Compositing Blends

• Addition Compositing is similar to Linear Dodge but skews towards a brighter result.
• Maximum Compositing is similar to both Linear Dodge and Addition Compositing, with an amount of contrast that is in between the two.
• Source Atop Compositing uses foreground pixels only, but displays them only where the background has pixels as well. This lets you use the background cue as a key and the foreground cue as a fill. The example videos here are poorly suited to demonstrate this effect since they are the same shape.