Search the Community

I am having some issues exporting PNGs from the SVGs in this pack from kenney.nl: http://kenney.nl/content/4-assets/41-platformer-art-deluxe/platformer-art-complete-pack-0.zip The SVG file in that pack is in the following location "Base pack/Vector/tiles.svg" An example of a properly exported PNG without weird gaps is here: "Base pack/Tiles/grassCenter.png" Please find the result when I export that part of the SVG attached, it has either white gaps or transparent gaps (this depends on the section of the SVG I try and export). I understand that there isn't any overlapping of the SVG paths and believe this might be the issue. Suggestions on how to workaround this issue would be much appreciated.

I am adding support for SVG sprites to one of my website frameworks. I'm loving the fact that in AD I can export all the individual icons as SVG in situ from the designs supplied, rather than having to assemble them in their own separate document. Being able to select each layer, create a slice and then adjust that slice's dimensions if I need to is fantastic. The end result is I get a lot of separate SVG icons. Then I expended a lot of energy installing Node, Grunt, SVGO, you name it in order to do the following: Optimise the SVG files Create an SVG sprite Copy all the individual icons into the sprite as symbols I realised it would have been SO much easier if AD (or AP) offered the ability to export selected slices as a sprite. I thought that might be what the Continuous checkbox did, but alas, no. For reference, my starting point for this was this page: https://24ways.org/2014/an-overview-of-svg-sprite-creation-techniques/, the section beginning HTML INLINE SVG SPRITES (specifically the latter section dealing with external sprite. It would also be advantageous to me if the style="fill:#HEXCOL" could optionally be dropped on each element on export as it prevents styling the elements with CSS. Thanks for making a great app even greater.

Hi, Is there a way to export images in a doc as links instead of base encoding them in the SVG. Thanks Greg

Does anyone know if there is a way to force all elements converted to SVG 'path' tags rather than primitive shapes such as 'rect', 'circle' etc. Converting a simple shape elements to curves doesn't help to my surprise. Even adding extra nodes to e.g. a rect or circle shaped curve still doesn't force it exported as a path in SVG file. It is extremely critical for us due to nature of the project. Any ideas please? I was so happy to escape Adobe CC train and last I want is to jump back just for the sake of SVG exports :(

I could use some help. I have some typed some phrases with glyphs and I want to export them as SVG for use with vinyl cutters. When I export the file as SVG and open it in my other software the phrase is all wonky. I have read that I would need to pull it into inkscape and trace it there but I don't seem to be able to do that either. I even downloaded an app "super vectorizer" with no luck. Can anyone give me some ideas here of what I am doing wrong? I have attached the file Kiss Me Now.afdesign

Blender has a way to render SVG files from freestyle renders. The attached SVG opens OK in Illustrator but both Affinity Designer and Photo claim "The file appears to be corrupted." Its just a cube :) 0001.svg

Hello, I have downloaded the trial version and have to say it is very nice. I loaded my current tvOS projects character SVG which has about 110 frames of character animations. Each frame comprised of about 30 elements. So a good test to compare to Inkscape 0.91 for performance. System is fairly maxed out 2011 iMac. Pros: Wow it is fast and scrolls in and out so smoothly Using the same keyboard shortcuts as the rest of OSX is nice as well Near perfect import of the test SVG (see cons for issues) Easy to use so far Awesome export options Cons: Clipped & Masked items in the test SVG did not import clipped or masked. This is actually quite a mess to have to clean up by hand. Color picker eye dropper was not nearly as intuitive to use as pretty much any other apps I have used. The click & hold then move selection area to color felt very awkward. Much prefer the select tool then move to area and click on color desired style eye dropper tools. Not so happy with the path node tools either. Enjoy having control arms on all three types of control nodes in Inkscape. Questions: 1. Is there something I am missing to fix the problem with Clipped elements on SVG import? I use this technique often in Inkscape so getting this right on import is important. Just to much work to fix it all by hand on every image and if I can't bring in all my old art it negates the value of moving to AD from Inkscape. 2. Is there a way to get a color picker that works more in line with the select object, select tool, select color (like inkscape) with out the need for the click/hold/drag AD uses? Being new I bet I missing something here. 3. Path node control arms for all nodes types would be nice, so am I missing the obvious on how to get them to appear? 4. I know they keep this tool up to date so I will ask about PNG export without transparency (Alpha). Anyone that is developing for Apple knows that they have moved several items to no Alpha channel and that they prefer PNG format files. The latest is Image Stacks for tvOS apps require the back most layer to not have any Alpha. So could that becomes a PNG export option? I ask about PNG because it is easier to keep all images in the same format vice a mix of PNG and JPG files. Also right now Apples tool chain for image stacks is young and mixing PNG/JPG in the stack has resulted in fun and for me it being easier to use Preview to fix the alpha channel as required and stay all PNG files. 5. Speaking of tvOS will there be an Export option to create the Parallax Images (.lsr files) added at some point? I have an idea on this might be done. Special template with 1 to 5 layers (range that Apple's LSR format allows. The export option would export each layer into the LSR file (layer 1 being back most) and then counting up from there. It would sure be awesome to have something like this for AD given that Apple released a plugging for PhotoShop to do just this. Again great product. Loving the trial version. Besides the clipped and masked objects not importing correctly I am thinking this is a clear move from Inkscape for me. Look forward to hearing back. Matt

I am working in AD and I need my file to be able to be opened in AI. I saw somewhere that svg is best if you have clipping masks. So I tried all and it the file gets rasterized weird and is not usable at all, and I get the Clipping will be lost on roundtrip to Tiny message. What blows my mind is that Inkscape gives me the file intact along with all the clipping masks and everything! Any clue anyone?

I have spent a few hours playing with the trial version of Designer. It seems to work like a charm, however, I don't seem to be able to export SVG images with CSS style sheets, either external or internal (CorelDraw works quite good in that respect). In Designer, all SVG style information appears to be in the form of in-line styles, resulting in unnecessarily large file sizes and making it difficult to use various css features and/or script manipulation of SVG images. Is this something you may be considering for future—hopefully not very distant—releases?

Hello, exporting my project as svg, the company printing and wrapping the car wasn't amused. Working with Corel Draw they had a lot of extra work to rescale, search for lost elements (QRs), ... Even when I open the .svg in AD it looks quite different then the orig. AD-Session. CMYK is also not recognized. eps & pdf looks cool, but there is no grouping for elements. I attach an actual sample with this post thanks a lot, Ralf 150814_L1H1_CMYK.afdesign 150814_L1H1_CMYK.svg 150814 Bildschirmfoto 2015-08-14 um 16.11.38.pdf

Is it possible to support an exported file from Inkscape that miss these...? - Corner Radius (Can be solved by turning curve to outline object) - Masking is lost **About masking; the SVG file which export from Illustrator, masking is lost too, but .ai .eps still work.

Hi there, I'm working with a document currently that has several embedded .afdesign files (as they were created in Affinity originally). However, when I export the document, all these elements are rasterised and become ugly. This is an issue as I'd like to be able to have one logo which I make tweaks to, embedded in some mockups. Is there a way around this? I really like the way embedding is implemented other than this. Cheers, D

When importing SVGs (which are great for retaining layers data) from Designer into Illustrator they're being scaled to the current/last document size used. Does anyone know how to rectify this (in either program)?

Would be useful to have this option for when using CSS to alter SVG in websites so we don't have to edit the code or use !important. (such as the bold bit in this sample) <path d="M1082.7…………86,320.174C1080.46,339.061 1082.76,370.645 1082.76,414.882L1082.76,727.84Z" style="fill:black;fill-rule:nonzero;"/>

Hi, I often design some assets for mobile apps and I usually encounter this problem. At design time, I'm used to use the "Erase" mode for some shapes (using compound shapes and/or cutting the underlaying shapes does not work in cases I need to use gradient fills or colored strokes). During export to vector formats, these "Erase" effects get rasterized, which is not what I need for the mobile app assets. In the end, I have to make copies of all the designs and "flatten" them manually, which is really slow and tedious process... I have to expand all strokes, convert many shapes to curves and make boolean cuts them with the "Erase" shapes over them. So, would it be possible to either support vectorized output of the "Erase" effect, or at least add some automated flattening procedure for layers / groups? Thanks for considering. This would be a huge time saver in my work flow :)

Hi, I've just been experimenting with exporting to SVG and importing the code into HTML so I can restyle with CSS but after trying a few options (not all of them...) it seems every path has a style already set which overrides my CSS style sheet. Is there a way to export without the style tags so I don't have to go through and delete them? Heres an example of what I mean: its the bold bit that I have to delete for every path. <path d="M1082.76,727.84L1002.6,727.84L1002.6,414.882C1002.6,378.12 1000.31,350.549 995.71,332.178C991.114,313.79 980.222,297.89 963.039,284.44C945.843,270.999 926.018,264.265 903.56,264.265C862.376,264.265 827.905,281.12 800.172,314.815C772.43,348.511 758.564,393.607 758.564,450.107L758.564,727.84L678.414,727.84L678.414,30.9654L758.564,30.9654L758.564,307.161C794.98,234.328 847.06,197.899 914.793,197.899C945.08,197.899 972.051,203.861 995.71,215.774C1019.36,227.686 1037.48,243.345 1050.08,262.745C1062.67,282.145 1071.27,301.286 1075.86,320.174C1080.46,339.061 1082.76,370.645 1082.76,414.882L1082.76,727.84Z" style="fill:black;fill-rule:nonzero;"/> thanks Gary

I've downloaded Affinity Designer Trial to see if I can get it to export an SVG of a purely vector design. For this project, it's incredibly important that the final product be an SVG that has zero rasterized elements in there so it can scale to multiple screen resolutions. The problem is that, while I've got the design looking good (well, as good as I can get it, being a programmer and not a designer!), when I export to SVG **without rasterizing unsupported effects** -- which I thought SVG supported shadows and gradients on a transparent background, right? -- the file has neither of those. I've attached the afdesign doc and a resulting SVG. Tried reading said SVG in Chrome and Firefox as well as Apple's Quick Look (which I believe uses Preview's built in magic magicness) and the shapes and colors are fine, just no drop shadow, no gradient, no transparency. Input appreciated. Thanks all. SVG Looks like this in quicklook: Postal Logo (Affinity) 2.svg Postal Logo 2.afdesign

Hi Just switched to Affinity Designer this week and love the app. I'm a Web/UI designer and need to able to export svg icons for web. I like the export features in AD, but I'm having an issue with the exported SVGs. The svg tag within the the svg file is exported with height and width set to 100%. (eg. <svg width="100%" height="100%" viewBox="0 0 44 44" … ). This is given me problems with creating svg icons to be used as background img in css, which needs specifically defined height & width in pixels. Right now I would have to open the svgs in a text editor and change them manually, which isn't a fun thing to do. So I'd like to see an export option that would set those dimension based on the slice dimensions, in pixels. Thanks for making such a great app. -Pete

Trying to export to PDF to get business cards printed. I imported a PSD template from moo.com with the right color spaces / etc. Tried importing my logo in EPS and SVG, which looks fine on screen. But when exporting to PDF it rasterizes. Afraid it's going to print terribly and considering just exporting a massive PNG instead. Disclaimer: I basically never do print work and have used Photoshop for under 3 hours in my life. Affinity Photo is a totally different app for me (Fireworks to Sketch user).

Dear Affinity-Team, I've been working on a logo font where i use mostly bezier curves to define the look and after that expand to strokes... while I'm used to clean expanded strokes/curves... within Illustrator for instance, in Affinity Designer the created points are quite a lot if not messy?! This is even more problematic (also slows down the app considerably) with SVG/EPS Exports. (see attached files) Optimising / simplify curves/strokes could be helpful.. in that case. As well just a better conversation or maybe better conversation control. Other than that is the Affinity Designer pretty nice!

Hello! 1. It will be nice to have an option to set defaults for svg export. For example default width and height are set to 100% by default and this is not good in most situations. 2. To be able to export svg i need to change app mode to EXPORT. Can you please add SVG file format to standard "save" dialog?

Sometimes it's important to make sure in the exported SVG files, each ID is unique among multiple files. It would be great if there's a way I can set up a namespace, or prefix to all IDs (a.k.a layer names) when exporting to SVG.

Hey, Love Affinity Designer – I see the distant light in the tunnel from Sans Adobe land! I'm guessing you know and love The Noun Project? A huge "free" pictograms collection growing by the minute. Well, they recently released a Mac client allowing me to browse icons and import the .SVG by dragging from the client directly. It is awesome. However, Affinity Designer (Beta) doesn't support dragging from the client. I have to drag to e.g. Pages and then into Affinity Designer. Would love to see improved drag support for .SVG! Johan

The only major thing holding me back from using Affinity as my full time vector image tool is the import handling of vector images. I use eps files a lot in my work and when I import(place...) an eps file it gets saved on the layer as an embedded document. I then have to double click on the image to edit it. Then I need to double click on that image to select its curves. I next copy its outline, go back to my original document and then I paste the outline into my document. I then need to delete the imported image(embedded document). If I don't do the above process, The image will not print(cut). Is there any way that Affinity can turn on a user preference that will allow a user to select if they want to import images as embedded documents or converted as curves upon placing them in the document? Or, provide a button that can be clicked to automatically convert to curves instead of doing the above procedure? I know this has been asked before but I haven't seen a definitive answer if this is something that will be available soon or not. It's this and curved text that is preventing me from cutting the strings on Illustrator (I can wait for the other goodies on your future upgrade path). I am using the beta.

Is it possible to export selected object(s) as SVG? I need to export to SVG in order to drive a vinyl cutter. If this isn't currently possible, is it on the roadmap to be added?