Color bend mode: Average opacity

When using overlapping objects with opacity, the resulting opacity effectively decreases, becoming more opaque.
Using an average opacity blend mode, the overlapping area can use the closest opacity to all the overlapping colors.

This can be useful when creating tables/figures with negative space so that the strokes overlap(Ensuring equal stroke width everywhere) while using opacity on the strokes. The image below shows how the overlap currently looks while having a background image behind it. The blend mode could ensure that all overlapping strokes keep the same opacity.

No blend mode:

After applying average opacity blend mode:

I don’t know how this can be achieved as a blend mode (however there probably is a formula one can invent for this — note that blend modes make calculations with colors, not opacity), but a common way to do this (both in Figma and in code) is to group the layers you want to have the same opacity and then then apply the opacity to the group itself instead of actual objects. And if you’d like the objects to have a semi-transparent fill instead of an object property, you can put them into a union boolean group and apply the fill to the resulting union object.

Okey, I didn’t know blend mode did not handle opacity :face_with_diagonal_mouth:

The grouping method does not seem to work in scenarios where you need other objects that should not have the opacity applied, example:

The first has no opacity, the second has grouping opacity, the third has opacity on individual object that is meant to have opacity. The items in the middle should not have opacity, thus the grouping methods does not work here.

Also using the union group on complex objects such as above does not seem to work very well.

You can make it work, just make sure the background is a single separate object.

Unions are made for objects that have a single color, of course it won’t work here. You have different fills on different objects.

I made it work by using a union to create an outline of the figure and then setting an outside stroke.
I removed the negative space between the objects and placed the union behind the figure. Thus filling the missing half of the outside stroke and avoiding the problem of the inner strokes overlapping.

The blend mode or formula could still be a nice addition, but my specific problem was fixed with the union.

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.