LAUNCHED: Plus Lighter and Plus Darker Blending Modes

Is anyone else in need of this blending mode? I have several Sketch projects in which I use it a lot. The only think that’s keeping me from migrating this file to Figma is the lack of this blending mode.

Just googled as I’ve never heard of this blend mode before. For anyone else wondering, it simply adds two colors together until you get 1 (for plus lighter) or 0 (for plus darker). It’s called Linear Dodge and Linear Burn in Photoshop and some other apps.

Replicating it in Figma

As this article notices, it’s possible to simulate Linear Burn (Plus Darker) with Subtract + Inversion. (Linear Burn) A+B−1 = B–(1-A) (Subtract with Inversion) — active Layer plus Background Layer, then white is subtracted from the sum (an inversion). And you can invert a layer in Figma with a Difference blend mode. But the problem is: there is no subtraction in Figma. :frowning: Difference doesn’t work as simple subtraction — it produces an absolute value as per this paper:

So unless you can find a way to do regular subtraction, there is no way to simulate this in Figma. Here is the result with Difference instead of subtraction:

Found it!

Aaaaand I found it. Since Darken blend mode produces the min of two values, it’s perfect for this. I just didn’t know where to put it at first. I had to turn these layers into components with Master plugin to be able to quickly edit them in one place and see the result everywhere.

And here is the result with a photo, I’m pretty sure that’s exactly what this blend mode should do:

Link to the file: https://figma.fun/TuOmXd

3 Likes

Thanks for the detailed explanation and the file! I’ll try it :slightly_smiling_face:

Please consider adding the plus-lighter and plus-darker blend modes. This is important for iOS development, but relevant for the web (mix-blend-mode: plus-lighter) too.

Hey All, thank you for your patience!

Today, we added two blend modes to Figma: Plus darker and plus lighter. These are most applicable to designing for iOS. Learn more here:

3 Likes

Great follow through, Denise! Thank you!

1 Like