Figma Crop Image

Cropping images in Figma helps you remove unnecessary parts of the image, and create cleaner, more professional designs.

Steps to Crop an Image in Figma

  1. Select the Image

  2. Select Fill

  3. Change from Fill to Crop mode

    In crop mode, you will see handles on the corners and sides of the bounding box. Click and drag these handles to adjust the crop area. You can resize the crop box to focus on the part of the image you want to keep. The area outside the crop box will be removed.

  4. Crop to desired size

  5. Finalize by clicking outsie

    Once you’re satisfied with the crop, click outside the image or press “Enter” to finalize the crop. The image will now be cropped to the selected area, and the excess parts will be hidden.

Tips for Cropping Images in Figma

1. Maintain Aspect Ratio

When cropping, you can hold the “Shift” key to maintain the original aspect ratio of the image. This is useful when you want to keep the proportions of the image intact while cropping.

2. Use Frames for Complex Crops

For more complex cropping needs, consider placing your image inside a frame. Frames allow you to mask images and apply more advanced cropping techniques. To do this, select the image and choose “Frame Selection” from the right-click menu or use the “Frame” tool.

3. Non-Destructive Editing

Figma’s cropping tool is non-destructive, meaning the original image remains intact and can be restored. If you need to revert to the original image, you can simply adjust the crop handles to reveal the hidden parts.