Hi there,
I am working through the responsiveImage set up, however I noticed that with my SVG assets they are returning null.
Just wanting to confirm if i’m doing something wrong or this is by design.
I saw this so it sounded like it should work?
https://www.datocms.com/product-updates/transformation-parameters-are-now-available-for-svg-format
Howwever I also see - this option exclduing svgs?
Here is an example: (the bottom record being a jpg and working)
Hey @joe,
It’s a bit of a complex answer 
I’ll try to break it down…
If you’re going to render the actual vector on your website as an SVG, you just need its image.url instead of its image.responsiveImage{}. Most of the time that will be fine. If you ever run into an issue with that, you can also append ?svgSanitize=false to that URL.
This is where it gets a bit complicated. Given a SVG like https://www.datocms-assets.com/150507/1738109732-person-2.svg, technically you can use Imgix to transform it, like https://www.datocms-assets.com/150507/1738109732-person-2.svg?fit=crop&w=300&h=300&fm=png&svgSanitize=false (which rasterizes it into a PNG and then crops it accordingly).
So then why don’t we do that automatically for you and return the results in responsiveImage? Turns out we tried to do that at one point, but ran into some bugs… SVG is a horribly complex format (which can contain embedded Javascript, HTML, fonts, other SVGs… etc.) and it’s not easy to guarantee correct parsing. Turning off SVG sanitize can help with that, and you can still manually apply those transformations by appending those params to the image.url directly. We leave that option in your control as a manual workaround. But as a failsafe, we don’t offer this directly through the GraphQL response.
Some previous threads on this topic, with some discussions:
Does that explain what’s going on?
TLDR if you just need to use the SVG as a regular SVG, use image.url and ignore the responsiveImage. If you do need to rasterize & transform, you can manually append Imgix query params to that URL… but be warned that we can’t guarantee this will always work (due to possible SVG complexities). Be sure to test every image you transform that way (or just rasterize them beforehand on your own computer and upload them as PNGs).
If it’s helpful, feel free to explain your use case a bit more here and we can discuss whether it’s better to inline that SVG, rasterize it, include it as an image, etc… there’s various pros and cons to each approach. It’s a whole thing…
