Solved

Photoshop normal blend formula

Posted on 2011-02-15
5
708 Views
Last Modified: 2012-05-11
Hi

I'd like to know the blend formula that Photoshop uses in it's Normal blend mode. Any documentation I find it says it replaces the layer's color by the brush color, which is true but nowhere does it say what happens with the alpha value.

For example, when I paint with magenta (255,0,255) with a 50% opacity and then paint cyan (0,255,255) also at 50% opacity on top of it, I get 85,170,255 with an alpha value of 0.75 as a result color. So obviously opacity of the brush color has a stronger influence than the opacity of the layer.

Just like the other blendmodes the Normal one has to have a formula to calculate the final color, does anyone know it?

Thanks in advance
0
Comment
Question by:Snapples
  • 3
  • 2
5 Comments
 
LVL 14

Accepted Solution

by:
tomaugerdotcom earned 500 total points
ID: 34907434
Normal blend mode is a straight function of colour replacement multiplied by the opacity factor.

The formula remains the same regardless of whether we're talking about a Brush being applied to a layer, with the Brush blend mode; or a second Layer overlaying the first layer with the Layer Blend mode set to Normal.

(RGB1 * (100% - opacity %)) + (RGB2 * opacity %) = RGB

Note that if you test this out in Greyscale mode, the numbers don't seem to add up because it's using the K value (0 - 100%) not the equivalent RGB value. Which is odd, but there you go.

And of course, for CMYK the formula is again based on the CMY and K channels, and results may be different (which is why we always work in RGB - EVEN when the job is going to go to print: you convert to CMYK AFTER you've flattened your final production image, never before).

T
0
 
LVL 14

Assisted Solution

by:tomaugerdotcom
tomaugerdotcom earned 500 total points
ID: 34907482
In re-reading your question, I wonder whether you're not making a classic misconception about how Brush opacity works.

Brush opacity works the same as layer opacity EXCEPT that RGB1 (the underlying "layer") is whatever is on the current painting layer SINCE THE LAST BRUSH STROKE. In other words, every time you release the mouse button, Photoshop does a "mini-flatten" of your painting layer.

Thus, if you have a white layer to start with, then grab Red with an opacity of 50%, the resulting colour is pink because it's 50% white and 50% red.

Then when you release the mouse button, Photoshop forgets all about that opacity and sees the new "flattened" layer as pink with 100% opacity.

So when you now choose green with 50% opacity and draw a brush stroke over the pink stroke the colour you get is a muddy green because it's 50% green + 50% pink.

0
 
LVL 2

Author Comment

by:Snapples
ID: 34946772
I'm sorry I took so long to respond, I've been busy with work related things and forgot about this thread.

Thank you for the formula. I didn't know whether Photoshop used the formula for regular alpha blending, premultiplied alpha blending or something else entirely.
I'm writing a painting app for a smartphone and I'd like to get the same behavior as one would get in Photoshop, and with your formula I do. So thank you.

Also thank you for that second post, it made me realise I had made a mistake, I was drawing the brushstroke to the layer every frame (about 30 times per second), rather than once every time the mouse is pressed and released. So I fixed it by drawing on a temporary layer from the moment the user taps the screen until he releases it and then flatten it with the layer below it.
0
 
LVL 2

Author Closing Comment

by:Snapples
ID: 34946779
Thank you, everything I needed to know.
0
 
LVL 14

Expert Comment

by:tomaugerdotcom
ID: 34946789
Right on, Snapples, good luck with the app! Sounds cool.

T
0

Featured Post

Microsoft Certification Exam 74-409

Veeam® is happy to provide the Microsoft community with a study guide prepared by MVP and MCT, Orin Thomas. This guide will take you through each of the exam objectives, helping you to prepare for and pass the examination.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

HOW TO CREATE A WEB 2.0 IMAGE WITH A REFLECTION I would like to start by saying I know Web 2.0 isn't a style. It is actually the practice of information sharing or  collaboration on the Web. It is also associated with the technology that is used …
Read about why website design really matters in today's demanding market.
Illustrator's Shape Builder tool will let you combine shapes visually and interactively. This video shows the Mac version, but the tool works the same way in Windows. To follow along with this video, you can draw your own shapes or download the file…
When you create an app prototype with Adobe XD, you can insert system screens -- sharing or Control Center, for example -- with just a few clicks. This video shows you how. You can take the full course on Experts Exchange at http://bit.ly/XDcourse.

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question