Background blur export doesn't work on svg

Seconded.

My dev team also experiences problems with exporting background-blurred components to svg - the blur filter just doesn’t apply and all we can do is export to png which is quite uncomfortable for me as a frontend dev.
Though it is possible to make the blur effect by manually changing resulting svg file.

I’ve found a SO thread with some thoughts on this problem, but unfortunately no links are allowed, guess I have to quote some answers:

the main problem is that the generated SVG is using in="BackgroundImage" as an input to the filter. No browsers support that feature AFAIK.
Instead of trying to blur the image, Figma’s approach is to try to blur the background and blend it on top of the picture.
The filter can be rewritten to avoid using BackgroundImage . You might want to file a bug with Figma about this issue.

by Paul LeBeau on Why svg blur dosen’t work in html or browser? thread on Stack Overflow

So i guess something went wrong jn Figma side with exporting blur filter

I have been having this same issue for the past two years and have been searching all over the internet for a solution. I ended up exporting the image as JPEG, though I was hesitant to do so. Are there any suggestions to work around about it?

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.