pegtop.net  >  delphi section  >  articles  >  blend modes  >  introduction
 delphi section   articles   blend modes   introduction   normal mode   average mode   multiply mode   screen mode   darken mode   lighten mode   difference modes   overlay mode   hard light mode   soft light mode   dodge modes   burn modes   quadratic modes   additive modes   interpolation mode   logical modes   RGB modes   HSL modes   opacity   dark modes   bright modes   final words   components   about me
 introduction

The standard image editing software is Adobe Photoshop, so all other graphic tools use the same or similar blending techniques. But there are also some blending modes that can be quite useful, which are not supported by Photoshop.

I only possess Photoshop 6.0, so please don't ask me about blending modes of other versions or other software.

Each mode comes with an example image as a result of following images using the respective blend mode:

 base image (background) blend image (layer) BTW: Both images were taken from our boat on the lake where I live :-)

I also included the (theoretical) mathematical formula for each mode. Most blending modes treat each color channel separately, so you have to use the formula three times - for the red, the green and the blue color channel (except for grayscale images). The theoretical formula is not speed optimized, but probably easier to understand. Input parameters are a (base color) and b (blend color), where a and b are floating point values between 0 (black) and 1 (white).

To analyze the modes two diagrams are helpful. The first one shows a horizontal gradient (black to white) as the base image, with a vertical gradient (black to white) as the blend image. This way all possible combinations of grayscale values are shown (showing all combinations of colors is kind of impossible). The second diagram shows 9 curves - the resulting value for all blend colors on 9 given base colors (black, dark gray... medium gray... bright gray, white). The 9 curves reflect 9 vertical lines through the first diagram.

Last but not least you can find some pseudo source code. The parameters a and b now are bytes (from 0 to 255) because most images are stored in this way. The value returned is result, which also is a byte. Remember that for RGB images you need to process each color channel, so better read
`result := (a * b) SHR 8;` as
```result.red := (a.red * b.red) SHR 8; result.green := (a.green * b.green) SHR 8; result.blue := (a.blue * b.blue) SHR 8;```

 index | previous page | next page