On this page
| Action | Mac | Windows |
|---|---|---|
| Quick crop (drag a corner) | Mac⌘-drag | WindowsCtrl-drag |
| Finish crop | MacEnter | WindowsEnter |
| Use as mask (for shaped crops) | Mac⌃⌘M | WindowsCtrlAltM |
Quick steps
Double-click the image
Double-click the image layer on the canvas to open its image settings.
Choose Crop image
Click Crop image in the Image section of the right sidebar, or set the image fill mode to Crop.
Drag the crop handles
Drag the handles to frame the part you want to keep. You can also move the image inside the crop area.
Press Enter
Press Enter to finish. Double-click again later to change the crop.
Is there a crop shortcut in Figma?
Not a single key. Figma's shortcut documentation doesn't list one for crop. The closest thing is the modifier drag: hold ⌘ or Ctrl and drag a corner handle of the image, and Figma crops instead of resizing. Press Ctrl+Shift+? to open the shortcuts panel if you want to check your version.
Crop mode vs Fill, Fit and Tile
An image in Figma is a fill on a layer, and the fill has four modes. Crop is the one that remembers exactly which part of the image shows. Fill covers the layer and trims whatever overflows, Fit shows the whole image inside the layer, and Tile repeats it at a percentage size. Switching to Crop mode is the same as clicking Crop image. How to add an image in Figma covers the other modes.
How to cut the excess outside a frame
If an image or any other layer hangs over the edge of a frame, select the frame and turn on Clip content in the right sidebar. Everything outside the frame's bounds is hidden but not deleted. This is the answer to a forum question with 13.8k views, and it's often faster than cropping each layer.
Cropping to a circle or custom shape
Crop only makes rectangles. For a round avatar, draw an ellipse, put it below the image, select both and press ⌃⌘M / Ctrl+Alt+M. See how to mask in Figma for why masks sometimes fail. To cut the subject away from its background entirely, see how to remove a background in Figma.
Frequently asked questions
What is the crop shortcut in Figma?
Figma doesn't document a dedicated crop key. Hold Cmd (Mac) or Ctrl (Windows) and drag a corner of the image for a quick crop, or double-click the image and choose Crop image.
Is cropping in Figma destructive?
No. The cropped area is hidden, not deleted. Double-click the image and choose Crop image again to change it.
How do I hide everything outside a frame in Figma?
Select the frame and turn on Clip content in the right sidebar. Layers that extend past the frame edges are hidden but stay intact.
More in Images, masks & shapes
- How to Make a Seamless Pattern in FigmaMake a seamless pattern in Figma: pick a tile size, wrap shapes that cross an edge to the opposite side, preview with a pattern fill, and generate grids faster.
- How to Mask in Figma (and Why Use as Mask Isn't Working)Mask in Figma with Ctrl+Cmd+M: put the shape below the content, select both, apply. Why Use as mask fails, how to edit or remove a mask, and inverse masks.
- How to Outline a Stroke in FigmaOutline stroke in Figma turns a stroke into a filled shape with Cmd+Option+O. How it differs from Flatten and Outline mode, plus the shortcuts for each one.
- How to Remove the Background From an Image in FigmaRemove an image background in Figma with the Remove background AI action, a free plugin, or a pen-tool mask. Credit costs, plan limits and why it isn't working.
- Figma Boolean Operations: How Union, Subtract, Intersect and Exclude WorkUnion, Subtract, Intersect and Exclude in Figma: the Alt+Shift shortcuts, which layer sets the style, why booleans fail on frames, and how to undo a union.
- How to Add an Image in Figma (and Replace It Later)Add images in Figma with Shift+Cmd+K, drag and drop or the fill picker. How to put an image in a shape, replace it, and choose Fill, Fit, Crop or Tile mode.
- Why Isn't the Glass Effect or Background Blur Working in Figma?Glass and background blur in Figma don't show on a layer with a 100% opacity fill. Fix it, build glassmorphism, and add grain with the Noise and Texture effect.
- How to Add Realistic Mock Data in FigmaHow to fill Figma designs with realistic mock data: names, emails, addresses, and AI-written text. Native Figma AI, lorem ipsum plugins, and Mock Master AI.
- Why Is My Figma Export Blurry, and How Do I Fix It?Why Figma exports look blurry or pixelated and how to fix it: export at 2x to 4x, pick the right format, check JPG quality and the 4096px image limit.
- How to install Figma pluginsFigma plugins don't need installing: open one from the Community or run it inside a file. Steps for Figma Design, Dev Mode, FigJam, Slides, saving and admins.
- Figma plugins not working? How to fix itFigma plugins not loading, missing or greyed out? Check your seat and edit access, org approval, network blocks and cache. A step-by-step checklist that works.