There are two types of image assets on Figma, and each one needs to be exported differently. After selecting an image, you can know what type it is by looking at the left sidebar.

Bitmap Assets

<aside> 👀 Photos, pictures, illustrations...

</aside>

After selecting the image, on the left sidebar, you can see that the image has a "picture" icon.

To export them, go to the "export" section on the right sidebar and click on the plus button three times. Make sure PNG is selected for the 3 exports and that the sizes are 1x, 2x, and 3x.

An image with a "picture" icon

Then, drag it to the assets folder on Xcode and make sure you select:

• Render As: Original Image
• Scales: Individual Scales

Vector Assets

<aside> 👀 Icons, Shapes...

</aside>

After selecting the image, on the sidebar, you can see many "vector" objects: squares, ellipses, paths... Make sure to select the whole icon, not just a part of it.

<aside> ⚠️ Most times, designers add a small margin to the icon, as you can see in the image below. Make sure you include it.

</aside>

To export them, go to the "export" section on the right sidebar and click on the plus button once. Then you'll be able to select the format you want.

• For Xcode +12 and iOS +13, use SVG.
• Otherwise, use PDF.

Make sure to select the whole icon, not just a part.

Then, drag it to the assets folder on Xcode and make sure you select: