Figma 101 – Using Images (6 of 12) Lesson Preview

Let's look at the various ways to add and manipulate images in our designs. We'll start with the simplest method, importing an image directly onto our Figma canvas. So start by navigating to the Figma icon dropdown in the top left corner and then go to File Place Image, and then a dialog box will appear where you can select the image you want to import. Your image will now show up attached to your cursor in the Figma interface, and you can click anywhere on the canvas to place it. The shortcut for this is Command shift K. Images on the canvas are exactly like the rectangles we just looked at in the previous lesson. The only difference here is that there is an image fill instead of a solid color fill. One of the quickest ways to import an image is by using the drag and drop method. Open any folder on your computer containing the desired image, then drag and drop it directly onto your Figma canvas. One of the coolest features about Figma and the way it handles images is the ability to copy an image directly from the web. To do this, we can right click on any image online and choose Copy Image. Head back to Figma and then hit Command V and boom, you have your image. Dragging and dropping and copying images on the web are the two methods that I personally use Most emitter.