How to Crop an Image in Figma (3 Easy Methods, 2026)

To crop an image in Figma, select the image, double-click it (or choose Crop in the fill settings), drag the handles to the area you want and press Enter. You can also crop with a shape mask or a frame that clips its content. This guide uses Figma and covers the three methods and when to use each.

Quick Steps

1. Select the image layer.
2. Double-click the image, or open its fill and choose Crop.
3. Drag the corner handles to the crop area.
4. Press Enter or click outside to finish.

Cropping Images in Figma: Step by Step

Method 1: Crop mode

Select the image and double-click it, or click the image in the Fill section of the Design panel and pick Crop. Drag the handles to cut the edges and drag the image inside to reposition it. Press Enter to apply. The original pixels stay in the file, so you can crop again later.

Method 2: Mask with a shape

Draw a shape (a circle, rounded rectangle or any path) over the image, select both and use Cmd+Option+M (Mac) or Ctrl+Alt+M (Windows) to Use as mask. This is the way to crop an image into a circle or custom shape.

Method 3: Frame clipping

Put the image inside a frame, resize the frame and keep Clip content turned on. Anything outside the frame is hidden. This works well for cards and thumbnails where the frame size is fixed.

Undo or change a crop

Double-click the image again to adjust it, or release the mask with Cmd+Shift+Option+M or by selecting the group and using the context menu.

Tips for Better Results

• Use frames for repeating card layouts so every image crops the same way.
• Choose Fill, Fit or Crop in the image fill settings to control how a photo sits in a shape.
• Export at 2x for sharper images on high-density screens.
• Keep the original image layer in a hidden copy if you may need the full picture.

Common Problems and Fixes

• The crop option is missing: select a single image fill, not a group.
• The mask crops the wrong layer: the shape must be above the image in the layer list.
• Edges look blurry: the image may be too small for the frame, so use a larger source file.

Why This Skill Matters for Design Jobs

Figma is named in 54% of the 109 UI and UX job posts ArtBlast tracked from March to August 2026 (59 posts), and in 29% of the 412 graphic and UI design posts (118 posts). Knowing it well is an easy way to stand out. Browse UI artist jobs, remote UI/UX designer jobs and junior UI artist jobs on ArtBlast, and compare tools in Figma vs Adobe XD.

Frequently Asked Questions

How do I crop an image in Figma?

Select the image, double-click it, drag the handles and press Enter. You can also use a shape mask or a frame that clips content.

How do I crop an image into a circle in Figma?

Draw a circle over the image, select both layers and use the Use as mask command (Cmd+Option+M or Ctrl+Alt+M).

Does cropping delete the rest of the image?

No. Crop mode hides the outside area and the full image stays in the file.

Can I crop several images at once?

Use frames with Clip content turned on and the same size for each, or apply the same mask shape to each image.

Sources

Steps were checked against the official guides in November 2026. Menu names can change slightly between versions.

• Figma Help Center

Job data: ArtBlast job tracking, March 13 to August 12 2026, distinct posts (one per employer and title) with a full description. UI and UX cohort: 109 distinct posts and 98 employers.