Hello,
my name is Ariana, UI/UX designer amateur for now but in future we will se what is going to happen 
I have noticed this problem recently.
When I export layers to PNG or JPG actually UI design to share on social networks, quality changes. On my Mac quality of image is good but when I share it for example on Instagram, it gets worse. It is blurry and bad quality.
My question is how to keep good quality of image and share it on social networks?
Thank you for any answers
Hi Ariana,
welcome to the community, we’re glad to have you here!
TL;DR
It is not Figma’s fault, but of the compression that’s happening when you upload to social medias.
When posting on most social medias, there’s a thing that happen when you upload a photo or a video: compression. Because of that, all the photos that are uploaded to the social media’s website will have a little worse quality (and be lighter too).
They do this to reduce the server load, save space, and to support slow connections too.
There is no practical workaround for this, as I know, because the compression is not made on your pc, but on the social media’s servers.
Also, I can give you a tip: when you design for specific social networks, look up for their standard asset sizes. For example, an Instagram standard post should be 1080x1080.
Figma comes in help showing some of the standards for different social networks (you can search them on the internet too):
It may not be the best explanation, but I tried 
.
-Rob
Hello,
thank you for explanation. It makes sense but I am still wondering how to make it right that quality is going to be good because many people when they post, their work is good (also doing in Figma) in my case is reverse 
I presume they begin with a square type of frame in 4K for example, then Instagram will resize it to 1080x1080 but still maintaining some quality. Though I am not sure, nor I tested this theory.
Also, when exporting graphics that are directly not photos, export them in PNG format.
Hi, I am having this issue as well. Exports from other design software doesn’t destroy the quality as much as Figma seems to. I’m sure I’ve missed something somewhere, so if there is a setting or something someone can point me to that would be very helpful. Is there a setting I can use to control more? Because the exports I am getting are garbage.
I’m still experiencing this same issue and I’ve followed all the recommended steps/frame-setup listed above, and found elsewhere, but still doesn’t solve the issue when exporting and this is even before uploading to experience the compression issue known to happen on some platforms.
I’m finding the blurriness to be around Text/Messaging and creating assets for Ads, I can’t export at 2x usually because the platform restricts size of upload, both in pixels and KBs.
Does anyone know of any workarounds or solutions to help with this?
Hello everyone!
I’ve had the same headaches as all of you and did some research. To sum it up, all we have to do is export in 2x for high res. Read this article for full explanation
https://www.danrodney.com/blog/retina-web-graphics-explained-1x-versus-2x-low-res-versus-hi-res/
@Shawn_Castillo has a point, it IS an issue for limited size of upload… I’ve read some people export as pdf and then convert to png but haven’t tried it myself.
Hope this helps.
@Fernanda_Trejo I tried exporting in 2x, unfortunately it didn’t eliminate the problem. The quality is still bad, the export isn’t crisp and has blurry edges.
I tried to export the same, unfortunately nothing is working the image still looks blurry and pixelated
I am having this issue as well. in 1, 2, and 3x PNG. As a test; If I export the bitmap and bring it back into figma, it looks nothing like the original. PDF looks great but i need a PNG. super frustrating. Sketch doesn’t have this issue.
Having this issue with exporting PDF’s. Half of the images come through at low resolution, with no way to change any settings and get them to full quality.
If this is a solution for not spending too much CPU time on exports, I end up needing to export the same file 10+ times trying to play roulette for a working version with no low quality images. I am sure this is much worse for the server, repeatedly exporting hoping for a working result.
Same exact problem :-/
Same as everyone else. I exported 1, 2, 3 and 4x for a project to post on Behance. Quality is not good. What’s the secret?
Hey @Jason_Carlson would you mind reaching out to our support team so they can take a closer look. If you could share examples and/or file access that would be super helpful.
Hi ! I have this problem when I export my work in PNG, so what I do is : I export everything in PDF (which has a great resolution) then I convert the files in PNG so that it doesn’t ruin the quality. It’s a longer process but it does the job !
Exporting the frame in 2x solved my issue, thanks!
Hey what do you mean covernt the files in PNG? you mean to PNG?
So Figma → Export to PDF → Open PDF (I use mac so mine opens in Preview) → Export to PNG - is that correct? do you change any of the pixel/inch values? i tried this but it’s still not good.
Is export the same as convert?
Figma team – please pass this along to your dev/QA team to review – there’s a bug with how you handle bitmaps during export.
Figma stores everything online. When you drop a large bitmap it gets uploaded and optimized into several resolutions and the most appropriate resolution is picked based the view. If it’s a tiny thumbnail of a large image – there’s no point to load an entire 10 MB image just to show that tiny version.
If you try to open a file with many large images you’ll notice how at first the lowest resolutions get loaded and the image is missing or looks pixilated at first. And then the appropriate resolution is loaded and substitutes the “temporary” one.
To be efficient, Figma doesn’t load images that aren’t visible and when you zoom out – there’s no point loading full-blown resolutions, because we only need a tiny preview. Smart. Until you try to export. Images whose full resolution version is not exported use whatever then can, as the result, some of them end up as squares.
To fix this you can zoom and just scroll around the page to make sure all images appear as they should and preloaded. Then press export and viola – everything looks like expected.
But shortly after Figma will unload those full-resolution versions, so it’s a pain in the neck. To make 100% sure it exports correctly you can zoom in on the graphic with an image and export it one at the time.
Figma team, if you need any details how to reproduce, feel free to get in touch! 