Search the Community

Hey guys, I've a really quick question. When exporting my SVG's, they're all given a width and height of 100%. And this is causing me huge issues with the program that's using the SVG's. Traditional SVG uses an actual width and height. AI currently has a flag option, 'responsive', however I cannot find one in AFD. Does anybody know how to export the SVG with non responsive width and height?

Hi, Is it somehow possible to import a SVG into an existing AD drawboard, and make the vectors part of the design, without working on it as an imbedded object?

Hallo Wie erstellt mann im Affinity Designer Vektordateien die für Schneideplotter verwendet werden können? Bin dabei, von Adobe Illustrator zu Affinity Designer zu wechseln. Leider aber funktionieren die Exportierten EPS oder SVG Datein nicht mehr für den Plotter. Was mache ich falsch? Muss ich die irgendwie speziell aufbereiten? Bitte um Hilfe!

I might be missing something really obvious here, but I can't appear to find any answers. Is it possible to add SVG code around shapes or groups such as animation or href tags via the 'export persona' workspace? If so can anybody guide me to information on how to do so? Cheers.

Hello guys (and affinity designer pros), I tried now 8 hours to fix this bug and it makes me crazy!!! First I have to say, I am not into graphic design, so I am only self-taught and everything I don't know how to do, I don not have any clue where to look for or what to google... I made an image with two colors, black and light green (#8EDB8D). Unfortunately because I don't have any clue about color management, when I save my image as JPG or PNG the colors look pale and sickly. I found out that it has something to do with RGB/CMYK conversion of print views and web views. Anyway I found an article in a forum, that I can save my picture as SVG (no rasterize) and open it again and export from new to JPG and then it should work... actually it did! For lots of small graphics consisting of texts and curves, this was a quite useful and effective workaround for noobs like me. Unfortunately, I made also an important big document with text, curves and pixel layers (I bought a Wacom tablet and drew some sketches, mostly shadows on my (boring) curves to have them look more realistic. I am quite happy with my results, because I started two weeks ago with 'graphic design'. Unfortunately, when I now export to SVG (without rasterize), all pixel layers disappear. If I export to SVG format with rasterize, they appear, but most graphics seem to be placed incorrect and stretched, so it seems to be difficult for lots of small pictures to correct them all by hand after a conversion, which should work automatically. So here's my two questions: 1) Does anyone know the official preferred way to convert my image without workaround (SVG conversion) to have the colors not being shale? 2) If not possible, does anyone know a way, how I can use my workaround with SVG conversion without disappearing all handmade pixel layers or having them stretched? BONUS: Does anyone know something else how to fix this? I'll attach my afdesign file (How to Flyer CMYK4) and a another jpg file (U CMYK) that shows, how the color of the light green should look like after conversion (not that pale, slicky one). Sorry for the probably dumb question... Thanks in advance for your support guys! You can't think how much your help will get me hope again, that it is possible with Affinity Designer to do some basic sketches for my homepage... Best regards, Matthias How to Flyer CMYK4.afdesign

I'm using SVG as an exchange format for a project to get data into Affinity Designer. The SVG standard does not support all blend modes that Designer supports, for instance the very useful "Erase" option is not supported. It would be cool if the SVG importer would simply accept the non-standard blend modes that are supported in Designer but not officially part of SVG instead of reverting to "Normal".

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

Situation: I use artboards. On the art board is an "Export Slice (SVG)" All exported SVG files contain a clipping path. An export without an art board with the same slice does not contain Clipping Path. Why? - The drawing objects contain no Clipping Path. See also the example files. artboards.zip

I did an SVG conversion on a jpeg and when I open it in Affinity my machine falls over (memory issue). Machine has 8GB Physical ram and 4GB Video ram. Weirdly, I can open the file and work with it very comfortably in Inkscape Is there anything I can tweak to avoid this issue in future? Are SVG's problematic in Affinity? Is there another format that it might play nicer with? Thanks J memory hog.svg

It would be very useful for the batch function to be able to save as SVG and to be able to select a whole folder as the input rather than individual files

Does the design loose some of it's effect like gradient/shadows when it is exported to EPS or SVG? I exported a design to EPS and SVG. I had a gradient button. I can't edit the features.

Currently exporting masked objects as SVG causes the objects to become rasterized. Disabling rasterization altogether when exporting will cause the mask object to end up visible in the result. Why is this? SVG supports masking after all. Clipping seems to be supported so why not masking?

Hi, when i export a Text as SVG from Affinity and then i import it in a 3d Software, all letters are a curve of their own. How can i export a word as ONE curve that can be changed in a 3D-Software. Thank you.

Hi , i was wondering if it would be possible to copy and paste content in SVG code or HTML5 from Affinity Designer to any text editor?

Hi, I want to export a slice to an SVG file. That works so far, but I have one problem, see screenshot. I assumed that the slice defines the area what gets exported. Since some elements are now outside this area, these get exported too. Rendering my SVG not useable. I would like to avoid, that I have to design everything fitting my export area etc. Any idea what to do?

So for some reason, I was trying to export an SVG file and only one or two layers are being exported. I have done others the same way and was able to get all the layers to export. What would be different about this image that all the layers are not being exported? Any help would be appreciated!

Hello there, I work in AD. The software is great, thanks for that. I need to export to PDF or SVG or EPS, does not matter to me ... including layers, that I could open the file in Adobe Illustrator and could see the layers. I was trying to find out on affinity forum, but I was not successful. Is there a way to do that please? Unfortunately, exporting to PDF does not do the job. Nothing is rasterized and after opening in illustrator there is just one layer instead of 3 created in AD. And what more, there are separated objects, the ones with fill and the ones with strokes. I mean, in AD it is an object with fill and stroke and after exporting to PDF and opening in AI these are two different objects, one with stroke and one with fill. I don't know why is that ? Thanks for help. I attached a file. 1100235_58_ultra_terno.afdesign

Hi, I am currently stuggling to export very simple shape with a shadow to SVG using Affinity Designer (Windows). The design is quite simple: It comprises two rectangles - one in red without a border and one in grey. The grey one works as a shadow. Therefore a Gaussian blur was applied ( I know there is an extra function to add shadows, but that one was not used). When trying to export this to SVG, AD wants to convert the grey rectangle to a bitmap. That leaves the SVG useless for me. I am surprised by this behavior as there is a gaussian blur filter in the SVG definition. Just to give an example of the usage of the "feGaussianBlur" in a SVG file: <?xml version="1.0" encoding="ISO-8859-1" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd"><svg width="380px" height="370px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>The simple feGaussianBlur filter</title> <desc> Example of usage </desc> <defs> <style type="text/css"> <![CDATA[ text {font-family:Verdana,sans-serif; font-size:16px; font-weight:bold;} ]]> </style> <symbol id="smilie"> <desc>ein lachendes Smilie</desc> <circle id="gesicht" cx="20" cy="20" r="15" fill="yellow" stroke="black" /> <circle id="auge-links" cx="15" cy="15" r="2" fill="black" stroke="black" /> <circle id="auge-rechts" cx="25" cy="15" r="2" fill="black" stroke="black" /> <line id="nase" x1="20" y1="18" x2="20" y2="23" stroke="black" stroke-width="2" /> <path id="mund" d="M 13 26 A 5 3 0 0 0 27 26" stroke="black" fill="none" stroke-width="2" /> </symbol><!-- 6 Filter mit feGaussianBlur --> <filter id="f1"> <feGaussianBlur in="SourceGraphic" stdDeviation=".5" /> </filter> <filter id="f2"> <feGaussianBlur in="SourceGraphic" stdDeviation="1" /> </filter> <filter id="f3" x="-20%" y="-20%" width="150%" height="150%"> <feGaussianBlur in="SourceGraphic" stdDeviation="1.5,.5" /> </filter> <filter id="f4" x="-20%" y="-20%" width="150%" height="150%"> <feGaussianBlur in="SourceGraphic" stdDeviation=".5,1.5" /> </filter><!-- zusätzlich mit feBlend, feOffset und feMerge --> <filter id="f5" x="-20%" y="-20%" width="150%" height="150%"> <feGaussianBlur in="SourceGraphic" stdDeviation="5" result="out1" /> <feBlend in="SourceGraphic" in2="out1" mode="darken" /> </filter> <filter id="f6" x="-20%" y="-20%" width="150%" height="150%"> <feGaussianBlur in="SourceAlpha" stdDeviation="2" result="out1" /> <feOffset in="out1" dx="2" dy="-2" result="out2" /> <feMerge> <feMergeNode in="out2" /> <feMergeNode in="SourceGraphic" /> </feMerge> </filter> </defs><!-- die Instanzen des Symbols "smilie" --> <use xlink:href="#smilie" transform="translate(20,10) scale(2.7)" /> <use xlink:href="#smilie" transform="translate(150,10) scale(2.7)" filter="url(#f1)" /> <use xlink:href="#smilie" transform="translate(250,10) scale(2.7)" filter="url(#f2)" /> <use xlink:href="#smilie" transform="translate(150,130) scale(2.7)" filter="url(#f3)" /> <use xlink:href="#smilie" transform="translate(250,130) scale(2.7)" filter="url(#f4)" /> <use xlink:href="#smilie" transform="translate(150,250) scale(2.7)" filter="url(#f5)" /> <use xlink:href="#smilie" transform="translate(250,250) scale(2.7)" filter="url(#f6)" /><!-- Text und Hilfslinien --> <text x="145" y="130">feGaussianBlur</text> <text x="58" y="130">Original</text> <line x1="137" y1="40" x2="137" y2="330" stroke="black" /></svg> Is there a workaround availabe to force AD not to convert objects into a bitmap during export? Thanks, Volker

Hi, is there any chance to add support for meta tags (like <title/>) in SVG file in Export options? It would be nice if <title/> equals file name. I think it would be helpful for front-end developers in some scenarios ;-) What do you think?

Hello, I have an animated GIF that I would like to recreate with an SVG instead. It seems like the easiest academic case for practicing snapping to me: everything is black and white and there are only horizontal and vertical lines. The snap points are easy to find automatically. However after quite some unsuccessful trial and error and reading in the forums it seems like there could be some slightly tricky behaviour about this... So please indulge if I ask now before digging further! ;) Thank you in advance for all hints, gergely FWIW here is the object:

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

I am creating some vector illustrations for the web. The image is made up of several layers. When I try to export as an SVG, each option states that some parts will be rasterized. I tried it as is and the whole image is rasterized and becomes unscalable. The whole idea of SVGs are for scaling vector images for various web resolutions. Why can't I do this in Affinity Designer?

Hi, We develop for Autodesk (external) and have a tool that allows users to copy/paste svg into Maya. We've been getting requests from users to better support Affinity so we're testing it out but getting an issue we can't get our head round. Our current workflow (or one of them at least) in Maya is based on the ability to copy SVG info out of e.g. Illustrator/web etc to your clipboard and then paste that directly into Maya (to create 3d geometry). I'm new to Affinity so maybe missing a workflow here but it seems this isn't possible? I've tried copying the clipboard from Affinity into a text editor but that doesn't seem to give any results. What does seem to work is copy/pasting into Illustrator. We also have an 'import svg' function which works fine from Affinity (i.e. File > Export > SVG) so a little in the dark about where the issue lies. Can anyone shed any light on this? i.e. what is actually being copied to the clipboard? Thanks, Chris

When attempting to export a design that has inner shadow on text. the shadow does not appear where it is supposed to. Latest AD for windows.

There is a bug with DPI settings in the Export Settings dialog: DPI settings are ambiguous after selecting a preset. I've written about this before. Here is how to reproduce it: Open the Export Settings dialog. Click SVG or PDF (I've tested these two formats only). Create a preset (if you still don't have one). Select your custom preset. Select 96 DPI in the DPI drop-down. Now choose another preset, say SVG for export. This will change Raster DPI to 300. Select 96 DPI again. Nothing happens. So... will I get 96 or 300 dpi? I hope this explanation is clear.