Jump to content
Sign in to follow this  

Better SVG Code Export needed + Better Vectorization

Recommended Posts


as a Designer & Dev (Game & Web) I usually need SVG's quiet often, I usually need to run those SVG's through a Converter (SVG => to Meshes). But now the Problem beginns, for example, if I use curves with brushes on them, then AD converts those brushes to simple images only (I looked through the exported code of the svgs). This is really bad news for me, Illustrator doesn't do that, Illustrator actually converts those brushes (even complex ones) entirely to SVG valid data. Is there a plan to improve the AD SVG Export Options anytime soon to make this work? If this isn't on the AD Roadmap anytime soon, is there a alternative way to do it then (e.g. Vectorizing those Brush Curves)? I am also missing vectorization of curves and other objects in AD in general, that would help out by quiet a lot.


[EDIT:] Seems like most AD Brushes are more or less Images (not the simple standard brushes), what makes it impossible to export it as valid SVG Data / Vectors, except if AD has some smart vectorization features in the future. Why are even Image Brushes allowed in AD? It's the opposite concept of a Vector Application, just wondering.



Kind regards,


Share this post

Link to post
Share on other sites

Yes Affinity still produces not clean SVG code for shapes and paths.

Just compare results from same graphic elements with Illustrator ones.

Please improve that.


Share this post

Link to post
Share on other sites



I know you have a lot on your plate but improving SVG export is a major issue for me as a UI designers.


As a quick comparison, yesterday I exported a file in different formats then run ImageOptim :


  1. PNG 87 kb -> 70 kb
  2. PNG @2x 238 kb -> 186 kb
  3. SVG 91 kb -> 90 kb

The SVG is lighter than the @2x and seems to be the obvious choice but I still needed a smaller file.


After checking the SVG code I discovered that paths where used instead of rounded rectangles, dashed strokes where also converted to paths and so on. The rounded rectangle seemed also quite messy and have a lot of data where there should be only 8 declarations (4 lines and 4 arcs).


After cleaning and editing the file I ended up with only 7 kb and there are still a complex path from AD that I could redo.


Now I know that not everything I did could be automatically done (I used symbols and masks) but even so they are a lot that could be improved and it seems you have all of the data needed to create a clean SVG file.

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.

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.

Sign in to follow this  

  • 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.