PEGTOP
 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
base image
(background)
blend image
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
 
© Copyright 2006 by PEGTOP Software