Images

Blend modes influence how the pixels of an image are affected by a painting or editing tool. The image below showcases how two images interact when the circle shape as the top layer has different blend modes applied.

The overlying layer is the Blending Layer, and the underlying layer is the Base Layer.

In our example below, the circle is the Blending Layer, and the dog is the Base Layer.

Here are a few examples of blend modes that you can use on your images in Linearity Curve (formerly Vectornator):

Normal

The ‘normal’ blend mode is the default setting in most software applications. It obscures the underlying base layer by covering it with the content from the overlying blend layer.

In the Normal Blend Mode, the color of the blending layer is placed on top of the base layer's color. No special blending takes place; only a change in opacity affects the layers. In this mode, the Opacity Slider controls the blend between the layers.

Darken

This blend mode shows the darkest values of the underlying base layer and the overlaying blend layer. It will not change if the colors on both layers are the same or if the overlying layer is lighter than the original.

The Darken Blending Mode compares the colors of the Blending Layer and the Base Layer and keeps the darker colors. Nothing will change visually if the colors of the blending layer and base layer are identical. White is completely invisible on the Blending Layer when you have activated the Darken Layer Mode.

Multiply

The Multiply Blending Mode multiplies the colors of the blending layer and the base layers, resulting in a darker color. This mode is very useful for darkening shadows.

If you want to quickly import an image with a white background as the Blending Layer of your composition you can use the Multiply Blending Mode to remove the white background without having to do it manually. White is completely invisible on the Blending Layer when you have activated the Multiply Layer Mode.

Lighten

Lighten is a blending mode in graphic design used to lighten the base layer's colors based on the blend layer's colors. This blending mode works by comparing the colors of the two layers and selecting the lightest colors from each.

When using the Lighten blending mode, only the pixels in the base layer that are darker than the corresponding pixels in the blend layer are affected. Any pixels in the base layer that are lighter than the corresponding pixels in the blend layer are left unchanged.

Screen

Screen is a blending mode commonly used to brighten up images and make them appear more vibrant. This blending mode works by multiplying the inverse of the colors in the blend layer with the base layer.

When using the Screen blending mode, the brighter parts of the blend layer will have a more significant effect on the image than the darker parts. This results in a lightning effect that can be useful when creating bright, glowing effects or making an image appear more vibrant.

Overlay

Overlay combines the colors of the blend layer with the base layer in a way that creates a high-contrast, vibrant effect. This blending mode works by multiplying the colors in the base layer with the colors in the blend layer if the blend layer's colors are brighter than 50% gray. If the blend layer's colors are darker than 50% gray, the base layer's colors are multiplied by the inverse of the blend layer's colors.

Difference

Difference creates an effect that shows the difference between the colors of the blend layer and the base layers’ colors. This blending mode subtracts the blend layer's color value from the base layer's color value.

When using the Difference blending mode, the resulting image shows the absolute difference between the colors of the two layers. If the colors in the blend and base layers are identical, the resulting image will be black. If the colors in the blend layer and the base layer are different, the resulting image will show the difference between those colors.

Exclusion

Exclusion creates an effect similar to the Difference blending mode but with less contrast and saturation. When using the Exclusion blending mode, the resulting image shows the difference between the colors of the two layers, but with less saturation and more subtle contrast than the Difference blending mode. This can be useful for creating softer, more muted effects or blending two images while preserving some of the details and textures of both images.

Hue

Hue is a blending mode that only affects the hue, or the color, of the base layer while keeping the brightness and saturation of the blend layer. This blending mode replaces the base layer's hue with the blend layer's hue.

When using the Hue blending mode, the resulting image retains the brightness and saturation of the blend layer but with the base layer's hue replaced by the blend layer's hue.

Saturation

Saturation is a blending mode in graphic design that only affects the base layer's saturation or intensity while keeping the blend layer's hue and brightness. This blending mode replaces the base layer's saturation with the blend layer's saturation. The resulting image retains the hue and brightness of the blend layer but with the base layer's saturation replaced by the blend layer's saturation.

Color

Color affects the base layer's hue and saturation while keeping the blend layer's brightness. This blending mode replaces the base layer's hue and saturation with the blend layer's hue and saturation. The resulting image retains the brightness of the blend layer but with the base layer's hue and saturation replaced by the blend layer's hue and saturation.

Luminosity

Luminosity is a blending mode in graphic design that affects only the base layer's brightness while keeping the blend layer's hue and saturation. This blending mode replaces the base layer's brightness with the blend layer's brightness. The resulting image retains the hue and saturation of the blend layer but with the base layer's brightness replaced by the blend layer's brightness.