Select Page

How to Resize & Crop an Image Using Mac’s Preview

Before you upload an image to a website, it’s best to resize it to an optimized size and crop it as much as possible to the look you’re going for. In this simple tutorial, I will show you how to resize and crop an image using Mac’s Preview (no need to upload to photoshop, Canva, or anywhere else!). I use this CONSTANTLY for client projects & it will be your new secret weapon.

We know everyone learns differently – if you prefer video, please watch the video tutorial below! If you’re more of a step-by-step person, we’ve written out the steps under the video.

Watch the Tutorial:

How to Resize & Crop an Image Using Mac’s Preview – Step by Step

*Note: In our video tutorial, we’re using images provided by ColorJoy Stock.

1. Crop your image

Open the image in Mac’s Preview. Click the image and begin dragging the dotted cropping line with your mouse until you reach the desired format.

TIP: hold down the Shift key as you drag your mouse so you can crop a perfect square.

Next, select Tools > Crop or hit Cmd+K keys.

2. Resize your image

Select Tools > Adjust Size.

In our video example, we reduced the image size from 3563 pixels squared to 800 pixels squared.

Before you add your image to your website, make sure you’ve optimized your image to improve loading speed. You can check out our Image Optimization tutorial for guidance.

Get Nerdy about Business, Websites & Tech with Us!

The Making Website Magic Community (hosted on Mighty Networks!) is a place where women web designersand developers can meet, mingle and make meaningful connections with industry collaborators. See you inside!

Article by

Sam Munoz

Sam is the CEO and lead web developer of Sam Munoz Consulting, LLC. Through years of coding, development & design experience - she is all about simplicity, minimalism & making websites that align with her client's business models & goals.

Keep Learning & Reading