Jump to content
greggman

Support more CSS layer style support in SVG exporter

Recommended Posts

Currently the SVG exporter seems to rasterize any later that isn't using a standard blend mode. But, ... CSS supports blend modes

https://developer.mozilla.org/ja/docs/Web/CSS/mix-blend-mode

I would be great if the SVG exporter could use those modes (optionally if need be).

As it is I have to tell Affinity Designer to not rasterize anything and then I have to manually edit the .SVG file and add the styles in

 

Below I included an afdesign file with just 2 overlapping circles, the one set to "hue" blend mode. Then there's the current exporter with rasterization  (Set low-res to make ti clear). Turning off all rasterization gets the "rasterize nothing" version but of course it doesn't match the original afdesign file. Manually adding "mix-blend-mode: hue;" in the style in the right place fixes it. Would be great if the exported exported the fixed version.

 

hue-layer.afdesign

hue-layer-current-exporter-rasterised.svg

hue-layer-rasterize-nothing.svg

hue-layer-rasterize-nothing-manually-fixed.svg

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

Please note the Annual Company Closure section in the Terms of Use. These are the Terms of Use you will be asked to agree to if you join the forum. | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.