Export losing quality even using PNG and 2X higher

That’s what downscaling does to raster images. Less pixels = less quality.

Instead of exporting, they can just grab the original image in the Inspect panel (blue link under File Name):

They will also need to apply a mask in development though. If you need to export with the applied mask, export the image with the multiplier of whatever the downscale factor was. E.g. if you scaled the image down 2x, export in 2x. If you scaled it down to 3x, export at 3x.

Or use the original image width/height if you masked only one side, like in your example. The original was 2734px high, and you didn’t cut the height of the image by your mask, so you can export it with 2734h setting.

However you don’t need more than 2x for development purposes, since the high-definition computer displays (e.g. Retina) only have the “2x” resolution. So nobody would see anything more than 2x resolution without zooming in manually. And with higher size export you are slowing down the load times of your page on the web. As an example, if your image is 200px in size in development, it should at most be exported at 400px.

Apologies if this has been explained earlier. I have a 300x300 base image. I want a 2x retina image at 600x600. Is this possible with Figma

Of course, just export it with a 2x multiplier. However if the frame contains raster images that are smaller than desired resolution (meaning they weren’t scaled down 2x or more to fit into that 300px frame), they would be pixelated as it is not possible to upscale raster images without losing quality.

Yes, that’s precisely the issue we are discussing here. Is it feasible to choose the resolution while exporting png/jpg in 1x. Currently, the default resolution is 72, and there’s no way to enhance it.

This video shows how we can export a 1x png with a higher resolution by exporting it into pdf and convert into png. At least, it works, but Figma should be aware of it’s time-consuming especially since there are tons of icons that need to be exported in different sizes and resolutions.

Figma is very much capable of that by default, just read my reply below that comment. If you have any difficulties let me know.

The problem may be related to video memory. With a large number of pages (several hundred or thousands), I have a very slow loading of images in high resolution. Moreover, when exporting a card, it can return to the preview state. In this case, with a card resolution of 1800x1200px, it was exported as 600x400px with the Nearest Neighbor image interpolation. Creating a new file and transferring pages there solves the problem (in my case).

You can type 1000w or 1000h in Export tab for high quality png.

Thank you! You are the best!

I have read all your comments related to this problem, but I didn’t understand what the solution to this problem is. I have a 26x26 size of icon and this is the 2x export result.

Here is your problem:

You are viewing it at 400% size.