I've tried to get the CSS "mix-blend-mode" property to work within a SVG. It displays fine in the browser but the blending is lost during conversion to PDF. Is there a way to archieve photoshop-like blendmodes in for SVG-elements?
I've experimented with the feBlend-Filter, but it combines only two distinct elements. Using the value "BackgroundImage" for one of the in-parameters did not result in the desired effect.... I'm not sure if I misunderstood something about the spec, but I never found an example where the beBlend-filter works like the layer-blend-mode (meaning that it blends with all underlying elements).
Unfortunately we don't support BackgroundImage at this time as it would require rasterising the parent content. We will investigate adding support for mix-blend-mode in a future release of Prince.
Thank you. I've looked a bit into uncompressed PDF sourcecodes I saved from Illustrator. It seems that newer PDF specs have an option to set the blend mode without any rasterization, since the implementation of the actual blending will be handled by Acrobat itself:
This sets the blend mode to "screen" for the referenced object. If this setting would be availiable trough either the "mix-blend-mode" CSS-property or some prince-specific property, it would help us a lot...
This is still a pain point. I've been struggling to fix up some SVG rendering in Prince by converting from CSS `mix-blend-mode` to SVG `feBlend` combined with `feImage` fragment links. While initially somewhat promising, I end up stuck with two issues:
1. I get different results for "multiply" between the original mix-blend-mode and the port to feBlend. My best guess so far is that this has something to do with pre-multiplied alpha but haven't chased it through yet, because… 2. The graphic designer also used an "overlay" mode, which at least Chrome seems to support via feBlend but Prince does not. The color I need to overlay is black so I'm trying to puzzle through the equations to see if I can come up with an equivalent for that reduced case via some feComposite trickery. Which if successful brings me back to the other issue at best…
Since feImage fragments aren't well supported across browsers, even if I can pull this off I then have to maintain each version to use based on rendering target…
We’re just working on some client imagery which requires the mixed blend mode CSS property in their online versions, and realised this isn’t yet supported in the PrinceXML pdf output.
Is this a property that can be prioritised for development?
