0

Suppose I have 3 layers in inkscape - from bottom to top, let's call them Layer 1 - Layer 3.

I want Layer 3 to blend with Layer 2 using the "Multiply" blend mode. But then, I want the result to blend with Layer 1 using the "Normal" blend mode - as though the composition of Layers 2 and 3 were itself a single layer.

Inkscape does have a concept of sub-layers, and intuitively, it seems I should be able to set Layers 2 and 3 as sub-layers of a parent layer, and then set the parent layer to "Normal" blending with the underlying layer. (I think this works in Photoshop.) However, this doesn't work as expected in Inkscape - the objects on Layer 3 still get multiplied with the content on Layer 1.

Questions:

  1. Is there a way to do this in Inkscape?
  2. If not, is this an inherent limitation of the SVG format (An object's blend mode MUST effect its composition with ALL elements under it, regardless of document structure or other factors) or simply a limitation of Inkscape?
  • I think there is a way to do this, but not via Inkscape GUI. Blend modes in Inkscape are just a special kind of filter. So you're applying a filter to a group (a blend mode to a layer) in SVG with Inkscape. The blend mode is set to use the BackgroundImage (other options are: background transparency, object transparency,...). I've found this in the SVG spec: w3.org/TR/SVG/filters.html#AccessingBackgroundImage which seems to talk about establishing new starting points for filter effects. However, I didn't really understand it. Maybe you can make something of it. – Moini Jun 5 '18 at 21:51
2

This question may be related and contain a partial answer.

Inkscape's system of layers is Inkscape's own functionality. It's currently not part of the SVG standard. For the present, SVGs don't support actual layers, only groups. If you create layers in Inkscape, and output as plain SVG, they will simply become groups (with layer names!).

Also there is no universal browser support for blending modes in SVGs as yet. From experiments I've done, Chrome and Firefox fail to render them properly, MS Edge seems to support it but messes up the SVG rendering in other ways. I've no idea if Safari will render blending modes properly.

Consequently, I suggest you don't use blending modes when creating SVGs at all, at least not until there is universal support for them, otherwise you are at the mercy of what browser is being used to view them, and whether it will render the image properly at all.

Of course, if you aren't using Inkscape to output SVGs for the web, but instead raster images such as PNG, then you can ignore this advice.

If you aren't outputting as SVG, then a possible work around is to put a duplicate of the "multiply" layer/group, set to "normal" and filled white, under the two layers/groups which interact with blend modes. Then the bottom layer/group won't interact with the "multiply" layer/group, because there will be a white layer between them.

For example:

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.