# Compositing images with vImage blend modes Combine two images by using blend modes to create a single output. ## Discussion vImage provides a suite of functions for compositing two source images into one output. These *blend mode* functions implement different algorithms to determine the output color. For example, the multiply blend mode sets each output pixel as the product of the two corresponding input pixels. The blend mode functions work on 8-bit RGBA source images in a premultiplied format. You can convert a nonpremultiplied buffer to a premultiplied format by using [`vImagePremultiplyData_RGBA8888(_:_:_:)`](/documentation/Accelerate/vImagePremultiplyData_RGBA8888(_:_:_:)). The blend mode functions accept two [`vImage_Buffer`](/documentation/Accelerate/vImage_Buffer) structures as the bottom and top layers of the compositing operation. The examples that follow use the image below on the left as the bottom layer and the image below on the right as the top layer. ![Two photographs. The photograph on the left is of a flower. The photograph on the right is separated into four quadrants containing white in the top left, gray in the bottom left, black in the bottom right, and content from the left photograph in the top right.](images/com.apple.accelerate/media-3685982@2x.png) The top-layer source image consists of four sections: - The top-left quadrant is solid white (`[255, 255, 255]`). - The top-right quadrant is identical to the corresponding quadrant of the bottom image. - The bottom-left quadrant is solid mid-gray (`[127, 127, 127]`). - The bottom-right quadrant is solid black (`[0, 0, 0]`). Both images are fully opaque. ### Composite images using the lighten blend mode Use the [`vImagePremultipliedAlphaBlendLighten_RGBA8888(_:_:_:_:)`](/documentation/Accelerate/vImagePremultipliedAlphaBlendLighten_RGBA8888(_:_:_:_:)) function to composite two layers using the lighten blend mode. You can use the lighten blend mode to apply an overall lightening effect to images. The lighten blend mode sets each channel of the destination pixel as the lightest value for the corresponding channel of the two source layers. The image below shows the result of compositing using the lighten blend mode: ![Three photographs. Two smaller photos are stacked on the left and an arrow points to a larger photograph on the right. The photograph on the bottom left is of a flower. The photograph on the top left is separated into four quadrants containing white in the top left, gray in the bottom left, black in the bottom right, and content from the bottom photograph in the top right. The photograph on the right is separated into four quadrants. The top-left quadrant is white, the bottom-left is a lighter version of the content from the smaller photograph on the bottom left, and the two right quadrants are the same as the corresponding quadrants of the smaller photograph on the bottom left.](images/com.apple.accelerate/media-3685983@2x.png) The top-left quadrant in the result is white because no pixels in the bottom layer are brighter than the corresponding pixels in the top layer. The bottom-left quadrant in the result looks washed out because the operation selects gray pixels from the top layer over corresponding dark pixels from the bottom layer. ### Composite images using the darken blend mode Use the [`vImagePremultipliedAlphaBlendDarken_RGBA8888(_:_:_:_:)`](/documentation/Accelerate/vImagePremultipliedAlphaBlendDarken_RGBA8888(_:_:_:_:)) function to composite two layers using the darken blend mode. You can use the darken blend mode to apply an overall darkening effect to images. The darken blend mode sets each channel of the destination pixel as the darkest value for the corresponding channel of the two source layers. The image below shows the result of compositing using the darken blend mode: ![Three photographs. Two smaller photos are stacked on the left and an arrow points to a larger photograph on the right. The photograph on the bottom left is of a flower. The photograph on the top left is separated into four quadrants containing white in the top left, gray in the bottom left, black in the bottom right, and content from the bottom photograph in the top right. The photograph on the right is separated into four quadrants. The bottom-right quadrant is black, the bottom-left is a darker version of the content from the smaller photograph on the bottom left, and the two top quadrants are the same as the corresponding quadrants of the smaller photograph on the bottom left.](images/com.apple.accelerate/media-3685980@2x.png) The bottom-right quadrant in the result is black because no pixels in the bottom layer are darker than the corresponding pixels in the top layer. The bottom-left quadrant in the result looks darker than the corresponding quadrant in the bottom layer. This is because the operation selects gray pixels from the top layer over corresponding light pixels from the bottom layer. ### Composite images using the screen blend mode Use the [`vImagePremultipliedAlphaBlendScreen_RGBA8888(_:_:_:_:)`](/documentation/Accelerate/vImagePremultipliedAlphaBlendScreen_RGBA8888(_:_:_:_:)) function to composite two layers using the screen blend mode. You can use the screen blend mode to lighten images without affecting the darkest areas. The screen blend mode sets the destination pixel as the inverted product of the inverted corresponding source pixels. The image below shows the result of compositing using the screen blend mode: ![Three photographs. Two smaller photos are stacked on the left and an arrow points to a larger photo on the right. The photograph on the bottom left is of a flower. The photograph on the top left is separated into four quadrants containing white in the top left, gray in the bottom left, black in the bottom right, and content from the bottom photograph in the top right. The photograph on the right is separated into four quadrants. The top-left quadrant is white, the top-right is a brighter version of the content from the smaller photograph on the bottom left, the bottom-left is a lighter version of that photograph, and the bottom-right is the same as the corresponding quadrant of that photograph.](images/com.apple.accelerate/media-3685981@2x.png) The bottom-right quadrant in the result is identical to the corresponding quadrant in the bottom layer because the operation multiplies each bottom-layer pixel value by `1.0`. For example, if the source pixel value is `0.5`, the destination pixel value is `0.5`. ```swift dest = 1 - (1 - 0.5) * (1 - 0.0) // dest = 0.5 ``` The top-right quadrant in the result is brighter than the corresponding quadrant in the bottom layer. In this quadrant, the top-layer and bottom-layer pixel values are identical. For example, if the source pixel value is `0.5`, the destination pixel value is `0.75`. ```swift dest = 1 - (1 - 0.5) * (1 - 0.5) // dest = 0.75 ``` ### Composite images using the multiply blend mode Use the [`vImagePremultipliedAlphaBlendMultiply_RGBA8888(_:_:_:_:)`](/documentation/Accelerate/vImagePremultipliedAlphaBlendMultiply_RGBA8888(_:_:_:_:)) function to composite two layers using the multiply blend mode. You can the use multiply blend mode to darken images without affecting the lightest areas. The multiply blend mode sets the destination pixel as the product of the corresponding source pixels. The image below shows the result of compositing using the multiply blend mode: ![Three photographs. Two smaller photos are stacked on the left and an arrow points to a larger photo on the right. The photograph on the bottom left is of a flower. The photograph on the top left is separated into four quadrants containing white in the top left, gray in the bottom left, black in the bottom right, and content from the bottom photograph in the top right. The photograph on the right is separated into four quadrants. The bottom-right quadrant is black, the top-right and bottom-left are darker versions of the content from the smaller photograph on the bottom left, and the top-left is the same as the corresponding quadrant of that photograph.](images/com.apple.accelerate/media-3685984@2x.png) The bottom-right quadrant in the result is black because the operation multiplies each bottom-layer pixel value by `0.0` from the top layer. The top-left quadrant in the result is identical to the corresponding quadrant in the bottom layer because the operation multiplies each bottom-layer pixel value by `1.0`. The top-right quadrant in the result is darker than the corresponding quadrant in the bottom layer. In this quadrant, the top-layer and bottom-layer pixel values are identical. For example, if the source pixel value is `0.5`, the destination pixel value is `0.25`. ```swift dest = 0.5 * 0.5 // dest = 0.25 ``` ## See Also --- Copyright © 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)